슬라이더의 사용자 정의 자동 회전 장치가 호버링 될 때까지 trigged되지 않습니까?

Question

나는 최근에 SquareSlider (http://gilbert.pellegrom.me/recreating-the-square-slider)를 수정하여 클라이언트가 자신의 광고판에 자동 회전 장치를 가질 수 있도록했습니다. 이것과 함께 누군가가 회전 장치를 가리키면 회전 장치가 멈추길 원했습니다. 기본적으로 스크롤러는 4 초마다 회전합니다.

// Automatic Rotation 
var autoScroller = function(){ 
    slides.removeClass('active'); 
    currentSlide++; 
    if(currentSlide > slides.length - 1) currentSlide = 0; 
    $(slides[currentSlide]).addClass('active'); 
}; 

// Pause the Rotation on Hover, resume when not hovering 
$('.square-slider').hover(function(ev){ 
    clearInterval(timer); 
}, function(ev){ 
    timer = setInterval(autoScroller, 4000); 
}); 

그러나, 일시 정지 - 온 - 마우스를 더 이상 autorotates에 추가 한 후 순서대로 페이지가로드는 먼저 슬라이더 위에 마우스를해야 회전 트리거 할 때. 어떤 도움이라도 먼저 마우스를 가져 가야하는 대신 페이지로드에 자동 회전되도록하는 데 큰 도움이됩니다.

다음은 jsFiddle에 대한 링크입니다. 다시 작성했습니다. 페이지를로드하면 슬라이더 위로 마우스를 가져갈 때까지 자동 회전이 수행되지 않습니다.

http://jsfiddle.net/dylanbaumann/RSP2z/

Answer 1

두 가지 : 1) 타이머를 초기화해야합니다. 아브라함은 이것을 가지고있었습니다. 2) 지금 마우스를 올리면 동일한 페이지의 모든 슬라이드 쇼에 영향을줍니다.

//declare the timer 
    var timer = setInterval(autoScroller, 4000); 

    //use the already defined slider variable instead of selecting all sliders 
    slider.hover(function(){ 
     clearInterval(timer); 
    }, function(){ 
     timer = setInterval(autoScroller, 4000); 
    }); 

Answer 2

당신은 당신이 그것을 지우기 전에 타이머를 정의 할 필요가

var timer = setInterval(autoScroller, 4000); 
    // BELOW THIS COMMENT IS THE ISSUE 
    $('.square-slider').hover(function(ev){ 
     clearInterval(timer); 
    }, function(ev){ 
     timer = setInterval(autoScroller, 4000); 
    });  

http://jsfiddle.net/RSP2z/6/

Answer 3

할 수 있습니다. var timer = setInterval (autoScroller, 4000);

희망이 도움이됩니다.