jQuery极慢的碰撞动画和div宽度问题

Question

我正在尝试制作三个圆圈的动画。中间的圆圈应该变大，这行得通。这个圆圈的缩放动画的阶跃函数测试这个圆圈是否与它周围的其他两个圆圈发生碰撞。这似乎有效，但由于某种原因，我必须在该圆圈的动画函数中将生长圆圈的宽度声明为通用变量，而不是在 testcollision 函数本身中调用其宽度方法。这是我的第一个问题。

我的第二个问题发生在中间圆圈变大并成功检测到与它两侧的两个圆圈的碰撞时。 testcollision 函数内部的动画函数使左边的圆圈平滑而完美地移动。右边的圆圈朝着正确的方向移动，但与左边的圆圈相比移动得非常慢，而且动作非常不稳定。我尝试降低右侧圆圈的持续时间，但这只是导致该圆圈“跳转”到动画中的某个点（例如，持续时间为 10，因此跳转到某个点需要 10 毫秒点在它的动画中）在非常缓慢地完全动画之前。

Answer 1

右边动画的问题显然是它接收的最终位置，它必须从你之前声明的变量中接收主圆的左边距+它的宽度，如果你事先知道你不知道的老板最终宽度不一定要一直测试碰撞，动画本身就会产生碰撞的错觉。

改变

var bossmoveright = boss.left + window.bosswidthfind + 6;

到

var bossmoveright = bossleft + bosswidth + 6;

FIDDLE：http://jsfiddle.net/eE4x7/1/