javascript - bxslider : how to make pause in `onSlideBefore` ?

Question

is there any option in bxslider to make pause transition in onSlideBefore ?

something like this

$('#bxslider').bxSlider({
  onSlideBefore: function(){
    pause: 100
  }
});

Answer 1

您只需使用 Bxslider 具有的 2 个选项“自动”和“暂停”即可完成此操作。

顾名思义， “自动”使滑块自动化，最终用户无需单击任何按钮即可滚动浏览， “暂停”决定了幻灯片之间的延迟。如果您不指定，默认延迟为4000 毫秒，但您可以输入自己的值。

因此，您可以简单地执行此操作，以获得图像之间延迟 1 秒的自动滑块。

$('#bxslider').bxSlider({
    auto: true,
    pause: 1000       
});

这是一个演示此效果的工作演示。jQuery、jQuery UI、BxSlider 等工具旨在为我们简化事情。所以让我们保持简单。

Answer 2

According to the documentation, you can do something like (untested) :

$('#bxslider').bxSlider({
  onSlideBefore: function(){
    $('#bxslider').stopAuto();
    var ctx = setTimeout(function() {
       $('#bxslider').goToNextSlide().startAuto();
       clearTimeout(ctx);
    }, 100); // delay
  }
});