jQuery动画 - 什么时候是异步的，什么时候不是？

我有我要动画两个div：jQuery动画 - 什么时候是异步的，什么时候不是？

<div id="character"> 
<div id="sprite"> 
</div> 
</div> 

$("#sprite").animate({"width" : "1", }, 400); 
$("#character").animate({"width" : "1", }, 400); 
$("#character").animate({"margin-left" : "0", }, 400);

但似乎前两个动画执行simultaneusly而当其他人完成了第三只启动。

为什么在前两个中是异步的，而不是第三个？我怎样才能让他们三个同时运行？

来源

2011-11-09 lisovaccaro

你可以把它全部入的jsfiddle与CSS的休息吗？ – Sparky

第二个$("#character").animate获得排队。如果你有2 $("#character")第二个只发生在第一个完成。你可以做的是：

$("#character").animate({"margin-left" : "0", "width" : "1", }, 400);

，以使双方的动画发生在同一时间，或：

$("#character").animate({"width" : "1"}, {"duration":400, "queue": false}); 
$("#character").animate({"margin-left" : "0"}, {"duration":400, "queue": false});

来源

2011-11-09 21:41:41 samura

animate有一个可选的queue选项告诉动画是否要被添加到队列。如果动画未排队，它将立即运行。每个元素都有自己的队列，所以$("#sprite")和$("#character")每个都有一个单独的动画队列。

如果您希望一切都立即运行，请使用队列选项。如果您需要将所有内容排队到同一队列，您需要创建自己的队列。 http://api.jquery.com/queue/

来源

2011-11-09 21:44:01

有关自定义动画队列的示例，您可以看到此问题http://stackoverflow.com/questions/5965371/single-queue-for-jquery-animate-elements/ –

尝试：

$("#sprite").animate({"width" : "1", }, 400); 
$("#character").animate({"width" : "1", }, 400); 
$("#character").animate({"margin-left" : "0", }, {duration:400, queue:false});

否则jQuery将排队的动画，看到docs for animate

来源

2011-11-09 21:44:06 topek

jQuery动画 - 什么时候是异步的，什么时候不是？

回答

相关问题