如何在悬停时添加暂停（jquery）

Question

以下是代码：

   $(document).ready(function(){
    $('#testimonials .slide');
    setInterval(function(){
        $('#testimonials .slide').filter(':visible').fadeOut(1000,function(){
            if($(this).next('li.slide').size()){
                $(this).next().fadeIn(2000);
            }
            else{
                $('#testimonials .slide').eq(0).fadeIn(2000);
            }
        });
    },1000);    
}); 

这适用于ul列表，并希望在悬停时添加暂停。有什么建议。 ？

Answer 1

您需要保存setInterval返回的对象，然后您可以将其传递给clearInterval以阻止它再次发生。

以下是一些示例代码，可以为您提供类似于以下内容的代码：

$(document).ready(function(){
    var slider = function() {
        $('#testimonials .slide').filter(':visible').fadeOut(1000,function(){
            if($(this).next('li.slide').size()){
                $(this).next().fadeIn(2000);
            }
            else{
                $('#testimonials .slide').eq(0).fadeIn(2000);
            }
        });
    };

    // save an object so that I can start and stop this as we go
    var interval = setInterval(slider, 1000);

    // when the user hovers in, clear the interval; if they hover out,
    // restart it again
    $('#testimonials .slide').hover(function() {
        clearInterval(interval);
    }, function() {
        interval = setInterval(slider, 1000);
    });
}); 

请注意，我不清楚究竟用户是什么来停止间隔，所以我假设您希望$('#testimonials .slide')这样做。如果没有，只需将该部分更改为您需要的任何部分。