我怎样才能使这个jQuery滑块自动

Question

我将完全诚实地告诉您，我从某个地方下载了此滑块，我对Javascript的了解非常少。

我正在尝试让滑块每隔4或5秒自动转到下一张图像或内容，并且我希望在鼠标悬停在内容上时使其停止。

这是我的代码

    $(document).ready(function(){ 

    if(jQuery("#slider").length){
        var totalImages = jQuery("#slider > li").length, 
            imageWidth = jQuery("#slider > li:first").outerWidth(true),
            totalWidth = imageWidth * totalImages,
            visibleImages = Math.round(jQuery("#slider-wrap").width() / imageWidth),
            visibleWidth = visibleImages * imageWidth,
            stopPosition = (visibleWidth - totalWidth);

        jQuery("#slider").width(totalWidth);

        jQuery("#gallery-prev").click(function(){
            if(jQuery("#slider").position().left < 0 && !jQuery("#slider").is(":animated")){
                jQuery("#slider").animate({left : "+=" + imageWidth + "px"});
            }
            return false;
        });

        jQuery("#gallery-next").click(function(){
            if(jQuery("#slider").position().left > stopPosition && !jQuery("#slider").is(":animated")){
                jQuery("#slider").animate({left : "-=" + imageWidth + "px"});
            }
            return false;
        });
    }

});

Answer 1

距离您不远，基本上，您只需要在计时器中重用下次点击功能，如下所示：

// Autoslide
timer = window.setInterval("autoSlide()", 1000);
function autoSlide(){ jQuery("#gallery-next").click(); }

因此，每1秒钟（1000毫秒），它将单击下一步按钮并滑动。 您将必须编写一些内容才能将滑块重新设置为开始。 如果要在悬停时暂停幻灯片放映，请执行以下操作：

jQuery('#slider').hover(function(){
   window.clearInterval(timer);
}, function(){
   timer = window.setInterval("autoSlide()", 1000);
});

您可能可以将计时器存储在var中，然后再次调用var，我只是复制一些代码，所以如果有人要纠正我，请执行！

Answer 2

您可以将以下内容放入document.ready函数中：

var autoNext = setInterval(
    function() {
        jQuery("#gallery-next").click();
    },
    4000
);

jQuery("#id-of-the-content-that-stops-auto-scroll").mouseover(function() {
    clearInterval(autoNext);
    jQuery(this).unbind('mouseover');
});