Question

我想设置flexslider，以便在鼠标悬停时启动/恢复自动幻灯片放映并在mouseout上暂停。恰好是正常行为的对立面。：d

所以我有这个问题： TypeError：'undefined'不是函数（评估'slider.resume（）'）并在互联网上搜索没有产生任何结果。

我的脚本是：

    $( document ).ready(function() {
    var $slider = $('.flexslider');

    $slider.flexslider({
    controlNav: false,
    directionNav: false, 
    slideshow: true,
    slideshowSpeed: 500,
    animationSpeed: 300,
    /*randomize: true,*/
    controlsContainer: ".flex-container",
    start: function(slider) {
        slider.pause();
        slider.mouseover(function() {
        slider.resume();
    });
  },
});

}）;

任何指向正确方向的指针都会有所帮助。

卢卡

*更新......我找到了一个有效的解决方案...如果有人想知道的是：

start: function(slider) {
        slider.pause();
        slider.manualPause = true;
        $slider.mouseover(function() {
            slider.manualPause = false;
            slider.play();
        });
        $slider.mouseout(function() {
            slider.manualPause = true;
            slider.pause();
        });
  }

卢卡

Answer 1

我找到了一个有效的解决方案：

start: function(slider) {
        slider.pause();
        slider.manualPause = true;
        slider.mouseover(function() {
            slider.manualPause = false;
            slider.play();
        });
        slider.mouseout(function() {
            slider.manualPause = true;
            slider.pause();
        });
  }

Answer 2

实际上这效果好一点：

start: function(slider) {
    slider.pause();
    slider.manualPause = true;
    slider.mouseenter(function(){
        slider.flexslider('next');
        slider.play();
        slider.manualPause = false;
    });
    slider.parent().mouseleave(function() {
        slider.manualPause = true;
        slider.pause();
    });
}

它可以防止多次触发功能，并且允许直接进入下一张幻灯片，而不会出现play（）函数的初始延迟。

Flexslider在鼠标悬停时恢复幻灯片放映

2 个答案: