在使用jQuery之前,我可以做一个链接动画,延迟时间如下：
$("#element").delay(45).animate({ },45)
.delay(45).animate({ },45);
现在,自从更新到v1.6.1而不是执行之前的操作之后,它现在跳到最后一个动画.忽略之前的陈述.我知道我可以为每个动画做一个不完整的回调,但这只是弄乱了：
$("#element").delay(45).animate({ },45,function(){
$("#element").delay(45).animate({ },function(){
$("#element").delay(45).animate({ },45);
})
})
有谁知道如何以简单干净的方式实现这一目标？
解决方法
这是第二种方式.我把它贴在另一个答案中,因为它更复杂,也许不那么漂亮.要玩它,请参阅：
http://jsfiddle.net/LMptt/1/
用法：使用带或的字符串来表示相对时间戳.该顺序对相对时间戳(相对于之前的操作)很重要.使用“0”或“-0”表示与前一个时间戳相同的时间戳.绝对时间戳(整数)可以放在列表中的任何位置.
$(document).ready(function ()
{
queue([
[2000,function () { $('.two').slideUp(); }],['-1000',function () { $('.one').slideUp(); }],[3000,function () { $('.three').slideUp(); }],['+1000',function () { $('.four').slideUp(); }]
]);
});
/**
* Queue.js
*
* @author Arend van Waart
*
* This will allow for events to be queued by (relative) timestamp
*/
function queue (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 i in self.queue) {
if (self.queue[i][0] <= self.timePassed){
self.queue[i][1]();
self.queue.splice(i,1);
} else {
// added sorting now,so we don't have to evaluate the rest.
break;
}
}
if (self.queue.length == 0){
return;
}else{
setTimeout(self.iterate,self.sleep);
}
}
this.parseRelative = function ()
{
var absoluteQueue = [];
var lastAbsolute = 0;
for (var i in queue)
{
var absolute;
var firstChar = String(queue[i][0]).charAt(0);
if (firstChar == "+" || firstChar == "-")
{
absolute = lastAbsolute + parseInt(queue[i][0]);
} else {
absolute = parseInt(queue[i][0]);
}
lastAbsolute = absolute;
absoluteQueue.push([absolute,queue[i][1]]);
}
this.queue = absoluteQueue;
}
this.sort = function (a,b)
{
return a[0] - b[0];
}
this.parseRelative();
this.queue.sort(this.sort);
this.iterate();
}