jquery - SlidesJS 悬停暂停功能

Question

我使用带有自定义分页的 SlideJS 这里是对幻灯片的 jquery 调用

$('#slides').slides({
            preload: true,
            preloadImage: 'img/loading.gif',
            play: 5000,
            pause: 2500,
            hoverPause: true,
            animationStart: function(current){
                $('.caption').animate({
                    bottom:-35
                },100);
                if (window.console && console.log) {
                    // example return of current slide number
                    console.log('animationStart on slide: ', current);
                };
            },
            animationComplete: function(current){
                $('.caption').animate({
                    bottom:0
                },200);
                if (window.console && console.log) {
                    // example return of current slide number
                    console.log('animationComplete on slide: ', current);
                };
            },
            slidesLoaded: function() {
                $('.caption').animate({
                    bottom:0
                },200);
            }
        });
    });

我厌倦了这个

$(".next").mouseover(
            function () {
            stop();
            })

在 $('#slides').slides{('pause')}; 之后 刚刚打破了幻灯片并添加了十几个分页 li 的

http://www.slidesjs.com

我已经添加了这个并且能够让播放器停止，但我还没有弄清楚播放部分。任何想法？

$('#stop').mouseenter(function(){ clearInterval( $('#slides').data('interval'));
                });
$('#stop').mouseleave(function(){ playInterval ( $('#slides').data('interval', playInterval));  
                });

Answer 1

最简单的方法是使用停止播放按钮来发挥您的优势。确保您已打开该选项：

$(element).slidesjs({
    play: {
        active: true,
        auto: true
    }
});

我这样做了：

$(element).on("mouseenter", function () {
    $(".slidesjs-stop").click();
});

$(element).on("mouseleave", function () {
    $(".slidesjs-play").click();
});

它有点蛮力，但效果很好。