JavaScript/Jquery Rotating Slider - Double Delay 문제

Question

약간의 도움으로 jquery와 CSS3을 사용하여 회전 슬라이더를 만들었습니다. 한 가지를 제외하고는 큰 효과가있는 것 같습니다. 첫 번째 '슬라이드'는 두 배로 보입니다. 처음 플레이 할 때까지 지연. 누가 이런 일이 일어날 수 있는지에 대해 밝힐 수 있습니까? 어떤 도움을 크게 초기 실행 시간 (당신의 지연)의 동일한 금액을 기다리고, ...

var i = 0; 
var z = 0; 
delay = 5000; 

var el = $('#scroll-script'); 
var ql = $('#info-box'); 

var classesb = ['fp-info-one', 'fp-info-two', 'fp-info-three', 'fp-info-four'];  
var classes = ['fp-slide-one', 'fp-slide-two', 'fp-slide-three', 'fp-slide-four']; 

var interval = setInterval(function() { 

    el.removeClass().addClass(classes[i]); 
    i = (i + 1) % 4; 

    ql.removeClass().addClass(classesb[z]); 
    z = (z + 1) % 4; 

}, delay); 

Answer 1

귀하의 익명 함수의 setInterval을 내부를 감상 할 수있다. 다음 중 하나를 수행 할 수 있습니다 :

1) 이름이 지정된 함수로 익명의 기능을 변경하고 간격

2)에서는 setInterval 방법 전에이 줄을 실행을 실행하기 전에 한 번 그것을 실행합니다. 익명 함수 내에서 코드를 한 번 흉내 낸다.

el.addClass(classes[3]); 
    ql.addClass(classesb[3]); 

이 피들을 살펴보고 내가 제공 한 몇 가지 해결책을 볼 수 있습니다.

http://jsfiddle.net/G7NdU/4/