jquery - jQuery 动画问题 chrome vs Mozilla

Question

我在尝试制作动画的 div 时遇到问题。在 mozilla 中，当我运行下面的代码时，我会从页面底部到页面顶部获得 #nav div 的动画。当我在 chrome 或 safari 中运行相同的代码时，它会跳转到浏览器窗口的顶部并向下移动 52px。你知道为什么会这样吗？

 $("#nav").animate({'top': 52}, 2000);

#nav div

position:absolute;
bottom:-70px;

第一个 onclick 事件从页面底部触发其部分外观。2nd onclick 触发它从页面底部移动到页面顶部。

score 2 · Accepted Answer

这似乎是由于您正在为top没有top集合的元素设置动画。top您可以通过在动画之前设置右边来解决此问题：

var $this = $("#nav");

$this.css("top", $this.position().top);
$(this).animate({"top": 0}, 1000);

编辑：top差异是由于浏览器在检查没有顶部设置的元素的值时返回的不同结果。你可以从这个小提琴中看到这一点：

Chrome 将返回“auto”，而 firefox 返回计算出的最高值。

1 回答 1