在jQuery动画上使用延迟

Question

我正在使用此代码来动画3个div，如何添加延迟以便动画将一步一步发生。现在3个div在同一时间是有生命的。请帮帮我。

这里是我的代码： $（文件）。就绪（函数（）{

//iPhone Animation/Define Variable 
var iPhoneOne = $(".iphoneOne"); 
var iPhoneTwo = $(".iphoneTwo"); 
var free = $(".free"); 

iPhoneOne.animate({marginTop:'80px',opacity:1},{duration:"slow", easing:"easeOutBounce"}); 
iPhoneTwo.animate({marginTop:'80px',opacity:1},{duration:"slow", easing:"easeOutBounce"}); 
free.show("fast"); 

}）;

Answer 1

我想这将是这样做的一种方法：

 
iPhoneOne.animate(
    {marginTop:'80px',opacity:1}, 
    {duration:"slow", easing:"easeOutBounce"}, 
    function() 
    { 

     iPhoneTwo.animate(
     {marginTop:'80px',opacity:1}, 
     {duration:"slow", easing:"easeOutBounce"}, 
     function() 
     { 

      free.show("fast"); 

     } 
    ); 

    } 
); 

Answer 2

我解决它。下面是代码：
$（文件）。就绪（函数（）{

//iPhone Animation/Define Variable 
var iPhoneOne = $(".iphoneOne"); 
var iPhoneTwo = $(".iphoneTwo"); 
var free = $(".free"); 

iPhoneOne.animate({marginTop:'80px',opacity:1},{duration:"slow", easing:"easeOutBounce"}); 
iPhoneTwo.delay(500).animate({marginTop:'80px',opacity:1},{duration:"slow", easing:"easeOutBounce"}); 
free.delay(800).show("fast"); 

}）;