另一个动画正在进行时，Jquery动画
我正在使用JQUERY EASING PLUGIN给出一个简单的缓动动画
ieeasing一个div从左边：200到左边：0和后面。（上一页的最后一个例子）
我在容器div中有多个div。我想要做的是按以下方式设置4个div的动画：
1]假设我有两个div，div1和div2。 当div1被动画化并且动画正在进行时 ，div2动画应该是start.eg：当div1从left = 200移动到left = 0时，div2动画应该在div1为left = 100时开始。
编辑 （注意：div的数量是可变的）
…….
当前动画正在进行中，并且到达一个点时， 下一个动画应该开始（动画的效果与所有div的效果相同）。
2]在迭代div集合和动画时，在给定的时间间隔内延迟下一个动画。
有没有办法知道动画的开始？ 还是动画正在进行中？
谢谢大家
您可以使用’：animated’伪选择器来查明元素当前是否处于运动状态：
if ($('#div1').is(':animated')) { // do something } http://api.jquery.com/animated-selector/
您还可以尝试step选项来检查div2何时应该开始动画：
$('#div1').animate({ left:0 },{ step: function() { // check distance and animate div2 when it reaches 100 } });
您正在寻找的答案在于“步骤”参数。
您可以定义一个步长参数，该参数在整个动画的范围内以一致的方式调用。 在每个步骤中，您可以检查动画的进度，如果它已达到阈值，则可以触发第二个动画。
例如：
$item1 = $("#myItem1"); $item2 = $("#myItem2"); $item1.animate({width: 500}, { duration: 1000, step: function(now, fx) { if (fx.state > 0.5 && fx.prop === "width") { if(!$item2.is(':animated')) // Make sure you didn't start the animation already $item2.animate({width: 500}, 1000); } } })
这个想法适用于任何数量的div，但显然你必须采用这个概念并修改它以适应你的情况。 请让我知道这可不可以帮你！
在此处阅读有关步骤函数的更多信息： http ： //api.jquery.com/animate/
您可以使用函数在一个位置管理动画。
setTimeout(doAnimate($div1),100);setTimeout(doAnimate($div2),200);
等等
您可以向animate函数添加回调：
$('#div1').animate( { left: 0 }, { duration: 'slow', easing: 'easeOutBack' }, function(){ //Do what you want in here, it will be executed once the animation above is completed. )};