JavaScript中的动画之间的延迟

Question

我在围绕一个圆圈旋转对象。当盒子到达顶部时，我想停止动画，应该有几秒的延迟，然后开始动画，直到下一个盒子到达顶部。

代码段：

if(x==40.109375 && y==218.015625){ 
    clearInterval(timer); 
    timer = setInterval(animate, 1000); 
} 

x和y是顶部位置的

Fiddle

Answer 1

你有动画再开始前设置超时。这样来做：

setTimeout(function(){ 
    timer = setInterval(animate, 35); 
},1000); 

至于你提到它，如果鼠标进入/离开盒多次奇怪的事情发生了。要解决它，一种解决方案是在更改之前检查timer的状态。请参阅此琴：

http://jsfiddle.net/p876D/3/

或者，你已经做了，清理超时将工作太

http://jsfiddle.net/p876D/4/

Answer 2

超时会延迟下一个间隔的开始坐标

if(x==40.109375 && y==218.015625){ 
    clearInterval(timer); 
    setTimeout(function() { 
     timer = setInterval(animate, 100); 
    }, 1000); 
} 

FIDDLE