javascript - 间隔之间的Javascript跳转

Question

好的，我正在尝试使用 javascript 构建自定义幻灯片，但我想为每张幻灯片设置自定义暂停间隔。

假设我有一个包含 3 张幻灯片的幻灯片，我希望它是这样的：

      30 seconds      8 sec  8 sec
|-------------------|------|-------|
       slide 1       slide2  slide3

我希望能够为函数提供间隔列表 [5 , 10 , 20] 并使用该间隔列表随机播放幻灯片列表。

我确实尝试使用带有 fun 的 setInterval 来解决这个问题，但不幸的是，它调用了下一个函数，但你知道它不能扩展到许多幻灯片，

代码

// slid is a class having all slides
function bringback() {
    slid.goToSlide(0);
}
function bringback2() {
    slid.goToSlide(2);
    setTimeout( bringback, 8000 );
}
$(document).ready(function(){  
    setInterval(function(){
        slid.goToSlide(1);
        setTimeout( bringback2, 8000 );
    }, 30000);
});

Answer 1

使用setTimeout：

;(function(){

  var intervals = [5,10,20];

  (function update(next){
    // Pick a slide and update the slideshow here

    setTimeout(function(){ 
      update((next + 1)%intervals.length);
    }, intervals[next]*1000);
  })(0);

})();

演示

你可以让它选择一张随机的幻灯片，或者只是按顺序遍历幻灯片，如下所示：

;(function(){

  var intervals = [5,10,20];

  (function update(next){
    slid.goToSlide(next);

    setTimeout(function(){ 
      update((next + 1)%intervals.length);
    }, intervals[next]*1000);
  })(0);

})();