悬停时jQuery Cycle2反转

Question

所以我正在尝试使用 Cycle2 插件创建一个轮播。与此不同的是，它不仅仅是在单击下一个和上一个按钮时来回循环，它还会在将鼠标悬停在按钮上时开始来回循环。

我可以使用以下代码为下一个按钮创建此行为，该代码暂停轮播并在下一个按钮悬停时恢复它。

$('.cycle-slideshow').cycle('pause');

$('#next').hover(function () {
    //mouse enter - Resume the slideshow
    $('.cycle-slideshow').cycle('resume');
}, function () {
    //mouse leave - Pause the slideshow
    $('.cycle-slideshow').cycle('pause');
});

我无法弄清楚如何在上一个按钮悬停时反转幻灯片的方向。有什么想法吗？

非常感谢任何输入。提前致谢。

Answer 1

假设.cycle('prev') 不会取消暂停轮播。如果是这样，您将需要在每次 .prev 调用后和鼠标离开功能后再次暂停它。

尝试类似：

var intervalVar;

$('#prev').hover(function () {
    //mouse enter - Resume the slideshow
    intervalVar = setInterval(function(){
        $('.cycle-slideshow').cycle('prev');
    },1000);
}, function () {
    //mouse leave - Pause the slideshow
    clearInterval(intervalVar);
});

这假设您每 1 秒循环一次。您可以更改 1000 以匹配轮播设置为转换的毫秒数。