jQuery的.animate与timefunction

Question

他的家伙......

我用这个豆蔻代码片段的jQuery：

function updown() { 
    $('#red').animate({top:'+=100'}, 5000, function() { 
     $('#red').animate({top:'-=100'},5000, function(){ 
      updown(); 
     }); 
    }); 
} 

updown(); 

（用于移动到右边我使用兴致）

，并得到这样的结果：

，但我想它是这样的：

有没有办法认识到这一点？

问候， bernte

Answer 1

当然，你可以使用jQuery delay()或Javascript的setTimeout，这里是前者：

function updown() { 
    $('#red').delay(7000).animate({top:'+=100'}, 5000, function() { 
     $('#red').delay(3000).animate({top:'-=100'},5000, function(){ 
      updown(); 
     }); 
    }); 
} 

Answer 2

function updown() { 
    $('#red').delay(3000).animate({top:'+=100'}, 5000, function() { 
     $('#red').delay(7000).animate({top:'-=100'},5000, updown}); 
    }); 
} 

updown(); 

延迟是你想要的。如上例所示，调用解析在执行下一个动画请求之前要等待的时间。谨防它，延迟只适用于动画。例如：

$("#red").delay(1000).css("display", "none"); 

将立即调用.css（），而不是在1000 ms后调用。