javascript - Howto：基于点击事件的暂停和播放 flexslider (jQuery)

Question

1. 我正在尝试将slider.pause()andslider.play()事件绑定到我的按钮（请参见下面的代码）。
2. 除非我单击播放按钮两次或在滑块运行时单击播放按钮，否则它会起作用。
3. 然后它似乎运行另一个实例（或其他东西），因为它以两倍的速度运行，并且暂停按钮不再停止滑块

问题：有没有办法在调用之前测试滑块是否正在运行，slider.play()或者 pause() 和/或 play() 调用是否在错误的位置？

请指教。

$(document).ready(function(){
    $('.flexslider').flexslider({
        animation: "fade",
        slideshowSpeed: 2000,
        pauseOnHover: false,
        touch: true,
        controlsContainer: ".fs-container",
        controlNav: true,
        manualControls: ".flex-control-nav li",
        start: function(slider) {
            $('.icon-pause').click(function(){
                slider.pause();
            });

            $('.icon-play').click(function(){
                slider.play();                      
            });
        }
    });
});

Answer 1

尝试：

$('.flex-slider').flexslider('pause');和$('.flex-slider').flexslider('play');。

Answer 2

7个月大的问题，但是start每次动画开始时flexslider上的属性都会触发。

所以你上面的代码是绑定重新绑定点击事件。

相反，你想要类似的东西：

        $('.icon-pause').click(function(){
            $('#your_slider_id').pause();
        });

你可以把它放在你的页面初始化函数中——或者任何地方，而不是在 flexslider 初始化中。

（当然.play()也是一种方法。）