javascript - 警报 .position() 方法无法正常工作

Question

我有一个地球绕太阳旋转的动画。太阳保持不动，但地球不断改变位置。

我想提醒一条消息“已对齐!”或者本地球与太阳完全垂直对齐时的情况。我一直在测试它，但除了页面加载时之外的任何时间我都无法收到警报消息，并且条件语句对应于页面加载时地球的位置，甚至在地球接近对齐之前.

下面的代码只会显示地球的位置，因为它的位置高于 400。所以如果我说，当positionplanet.left == Positionsun.left 时发出警报消息，我将什么也得不到。

var possun = $( "#Sun" );
var positionsun = possun.position();

var posplanet = $( "#Earth" );
var positionplanet = posplanet.position();

if (positionplanet.left >= 400)
{
alert(positionplanet.left + " and " + positionplanet.top);
}

我有一个用于动画的 JSfiddle，但由于某种原因，除了随机字符串之外，我无法发出任何警报。所以我会链接它，但主要仅供引用。 Demo:

Answer 1

我还没有检查你的数学，所以我不能明确地证明这一点，但似乎位置永远不会完全匹配 - 这并不奇怪，因为我们正在处理四舍五入到 10-15 的无理数像素小数。

但是，如果您允许位置与最近的像素匹配，则可以使其工作(并且没有人应该更明智)。另外，您需要对动画的每一步进行检查，而不是像 JSFiddle 那样在全局范围内进行检查(难怪您只有在重新加载页面时才会收到警报。:) )

将其放入 animate() 函数中即可达到目的:

var positionsun = $("#Sun").position();
var positionplanet = $("#Earth").position();

if(Math.round(positionplanet.left) == Math.round(positionsun.left))
    alert("aligned!");

此外，如果使用 jQuery 函数(如 $(...))，请确保包含 jQuery。