在使用 jQuery 之前,我可以做一个带有延迟的链式动画,如下所示:
$("#element").delay(45).animate({ }, 45)
.delay(45).animate({ }, 45)
.delay(45).animate({ }, 45);
现在,自从更新到 v1.6.1 以来,它不再执行以前的操作,而是跳到最后一个动画。忽略前面的陈述。我知道我可以为每个动画执行一个 oncomplete 回调,但这会变得很混乱:
$("#element").delay(45).animate({ }, 45, function(){
$("#element").delay(45).animate({ }, 45, function(){
$("#element").delay(45).animate({ }, 45);
})
})
有谁知道我如何以简单干净的方式完成此任务?
编辑:添加了一个Fiddle http://jsfiddle.net/nhAdY/给你玩
我不久前写了这段代码,也许它对你有用? (抱歉缩进混乱)
/**
* Queue.js
*
* @author Arend van Waart
*
* This will allow for events to be queued by timestamp
*
* @example
* queue({
* 1000: function () {
* // element a na 10ms uitfaden, en daar 100ms over doen
* $('#menu').fadeOut(2000);
* },
* 500: function () {
* // na 50 ms element b en c inzoemen
* $('#content').slideUp(2000);
* }
* });
*/
var queue = function(queue){
var self = this;
// queue
this.queue = queue;
// time passed is 0
this.timePassed = 0;
// time in ms to sleep between checks.
this.sleep = 100;
var time = new Date();
this.lastTime = time.getTime();
this.iterate = function(){
var total = 0;
var time = new Date();
// how much time has passed since we slept?
self.timePassed = self.timePassed + (time.getTime() - self.lastTime);
self.lastTime = time.getTime();
for (var t in self.queue){
if (t <= self.timePassed){
self.queue[t]();
delete(self.queue[t]);
}
total++;
}
if (total == 0){
return;
}else{
setTimeout(self.iterate, self.sleep);
}
}
this.iterate();
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)