別のアニメーションをネストするのに1秒の遅延を使用する

Question

現在タイムアウトを使用していますが、遅延を使用したいと思います。私が最初のアニメーションの2番目のアニメーションを通過するとき、私はもう一方のアニメーションを開始したい、それは線形アニメーションです。各アニメーションが終了すると、どのように検出できますか？

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