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

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) 
});