在鼠標懸停停止jquery動畫

Question

我發現這個偉大的垂直幻燈片腳本。 我的問題是，我無法找到一種方法來停止在鼠標上的幻燈片播放。 請你能幫我嗎？先謝謝你 ！

setInterval(

    function() { 
     $('#ticker div').each(function() { 
      $(this).animate({ 
       'top': '-=10px', 
      }, 120, 

      function() { 
       var top = parseInt($(this).css('top').replace('px', '')) + 
         parseInt($(this).css('height').replace('px', '')); 

       if (top < 0) { 
        //console.log('removing', this) 
        var clone = $(this).clone(); 
        var parent = $(this).parent(); 
        clone.css('top', '550px'); 
        $(this).remove(); 
        parent.append(clone); 
       } 
      }) 
     }) 
    }, 40 
) 

Answer 1

如果您存儲了intervalID，則可以停止該間隔。這可能對你有用。代碼看起來象下面這樣：

var intervalID = null; 
function startSlideshow() { 
    intervalID = setInterval(function() { 
     //do stuff 
    }, 40); 
} 

$("#mySlideshow") 
    .mouseover(function() { 
     if(intervalID) { 
      clearInterval(intervalID); 
     } 
    }) 
    .mouseleave(function() { 
     startSlideshow(); // restart slideshow when the user isn't hovering anymore 
    }); 

startSlideshow(); //initially start slideshow. 

您可以在MDN找到clearInterval更多信息。

Answer 2

這裏是代碼 -

$("#ticker div").mouseover(function(){ 
    $(this).stop(); 
});