我正在使用轮播here,并添加了自动滚动功能:

// auto scroll
setInterval(function() {
aux.navigate( 1, $el, $wrapper, settings, cache );
},2000);


不幸的是,它一直在滚动...将鼠标悬停在项目上以能够单击“更多”按钮时,如何暂停或停止自动滚动?

最佳答案

在每个项目的鼠标悬停时设置一个变量,然后在对项目进行动画处理和滑动之前,使用此变量在navigate方法中进行检查。如果鼠标位于项目上,则无需执行任何操作即可从navigate方法返回。

var mouseOnItem = false;

$('.ca-item').hover(function(){
    mouseOnItem = true;
}, function(){
    mouseOnItem = false;
});

 var aux = {
    // navigates left / right
    navigate: function(dir, $el, $wrapper, opts, cache) {
        if(mouseOnItem)
            return;

        ...
        ...
    }
    ...
    ...
  }


工作演示-http://jsfiddle.net/S83Tp/2/

关于javascript - 悬停时停止或暂停自动滚动功能,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/9776842/

10-09 19:24