Question

首页上有三个旋转器，我希望它们相继启动1秒钟。

$(document).ready(function(){
    $('#rot_top').cycle({       
        speed: 500,
        timeout: 2000
    });
    $('#rot_mid').cycle({       
        speed: 500,
        timeout: 2000
    });
    $('#rot_btm').cycle({       
        speed: 500,
        timeout: 2000
    });
});

在首次开始后 - 他们应该按照他们的常规超时进行。

非常感谢您的帮助。

Answer 1

看起来你正在使用jQuery Cycle plugin？如果是这样，那么delay选项只会延迟第一次更改：

$(document).ready(function(){
    $('#rot_top').cycle({           
        speed: 500,
        timeout: 2000
    });
    $('#rot_mid').cycle({           
        speed: 500,
        timeout: 2000,
        delay: 1000,
    });
    $('#rot_btm').cycle({           
        speed: 500,
        timeout: 2000
        delay: 2000,
    });
});

这将立即开始第一个循环，第二个循环开始一秒钟，第三个循环开始一秒钟。

Answer 2

setTimeout对此非常有用，请尝试一下：

$(document).ready(function(){ 

  startCycle = function({
    $('#rot_top').cycle({speed: 500, timeout: 2000 }); 
    $('#rot_mid').cycle({speed: 500, timeout: 2000 }); 
    $('#rot_btm').cycle({speed: 500, timeout: 2000 }); 
  })

  setTimeout(startCycle();, 1000)
});

jQuery旋转器的延迟启动，彼此相隔一秒

2 个答案: