jQuery .animate 在 Firefox 中工作，但在 Chrome 和 IE 中不起作用

Question

我有一个基本动画，我正在尝试使用 http://jsfiddle.net/5YrF2/3/

在 Firefox 中，一切都按预期工作，但在 Chrome 或 Internet Explorer 中，动画对象的位置在第一个动画命令后跳到屏幕底部。

有人能看出我做错了什么吗？

更新我现在已经在http://jsfiddle.net/5YrF2/6/处创建了带有额外管道的新版本动画。

在 .block3 动画之前一切正常，它应该向右移动 10 像素，然后向上 15 像素。相反，它会做出一些奇怪的摆动。大家有什么想法吗？

Answer 1

您有一个绝对定位的 div，没有设置底部。 Chrome 和 IE 在这种情况下工作正常 - 您的第二个动画将 10 添加到“底部”，这将底部设置为 0(因为它未设置)并将其动画为 10。“底部”为 10 的绝对定位的 div，并且没有顶部，将显示距容器底部 10 像素的位置。

您希望元素“向上”移动吗？如果是这样，我会说使用 top 代替。 (但是你也会遇到同样的问题，因为你也没有设置顶级属性)。我会去掉元素上的“margin-left”和“margin-top”，并使用顶部/左侧等。相反。