使用延遲一秒來嵌套另一個動畫

Question

我目前正在使用超時，但我想使用延遲。當我傳遞第一個動畫的第二個動畫時，我想讓另一個動畫開始，這是一個線性動畫。如何檢測每個動畫何時結束？

http://jsfiddle.net/ohtkmes8/4/

$('#coolDiv2').css({ 
    left: $('#container').width() - $('#coolDiv').width() 
}); 
$("#coolDiv").css({ 
    left: $('#container').width() - ($('#coolDiv').width() + $('#coolDiv2').width()) 
}).animate({"left":"0px"}, 9000); 
setTimeout(function(){ 
    $('#coolDiv2').animate({"left":"50px"}, 9000); 
}, 1000); 

<div id="container"> 
    <div id="coolDiv">cool</div> 
    <div id="coolDiv2">other text</div> 
</div> 

Answer 1

jQuery的animate方法接受一個回調參數當動畫完成被稱爲：

$("#coolDiv").css({ 
    left: $('#container').width() - ($('#coolDiv').width() + $('#coolDiv2').width()) 
}).animate({"left":"0px"}, 9000, function() { 
    $('#coolDiv2').animate({"left":"50px"}, 9000); 
});