Question

我有一个jquery图像滚动条，当到达最后一个<li>时会附加第一个<li>，依此类推。但是，当我使用悬停而不是onclick时，下面的代码

  jQuery("#gallery-next").click(function () {
     next_scroll();
 });

 function next_scroll() {
     if (jQuery("#gallery").position().left > stopPosition && !jQuery("#gallery").is(":animated")) {
         jQuery("#gallery").animate({
             left: "-=" + imageWidth + "px"
         });
     }
     if (jQuery("#gallery").position().left == stopPosition) {
         $("#gallery > li:first").appendTo("#gallery").fadeIn('slow');
         return false;
     }
 }

如何使mouseenter / hover工作而不是单击功能。我在这个论坛上看到过非常相似的其他解决方案，但我无法利用这些解决方案。所以请用代码回答。这将非常有帮助。这是一个检查Fiddle的链接提前致谢

Answer 1

如果我理解了这个问题，你需要改变这个：

jQuery("#gallery-next").click(function () {
    next_scroll();
});

这个：

var timer = 0;
jQuery("#gallery-next").
mouseover(function () {
     //Call next_scroll() every two seconds
     timer = setInterval(next_scroll, 2000);})
.mouseout(function(){
     timer = clearInterval(timer);
});

更新：setInterval()不是setTimeOut()，对此感到抱歉，请查看updated fiddle

jQuery悬停追加不起作用

1 个答案: