2

编辑：我继续研究这个问题并缩小这个 JS Fiddle 中的问题。

http://jsfiddle.net/r7ab4/4/

单击“按钮 - 向下滚动”以.col向下移动。然后单击“按钮 - 返回到 0”，.col通过返回 回到原来的位置marginTop:0。除非它没有。它最终会达到一些未指定的值。任何想法为什么会发生这种情况？

下面的原始问题。

请参阅此测试页面以查看我的问题：

http://joinersart.co.uk/test

如果单击页脚中的内容按钮，“col-aboutus” div 将从 height:0 扩展到 height:100% 以显示“内容页面”。点击右上角的主页返回。

问题：“col-aboutus” div 及其所有子 div 应设置为 margin-top:0。这意味着您在内容页面中看到的第一个 div 是“SECTION ONE”。当您单击红色链接“NEXT - SECTION TWO”时，margin-top 应动画为“-200px”，这会使内容向上滑动到下一部分。问题是，一旦您单击红色链接，“col-aboutus”div 的 margin-top 似乎会变为某个未指定的负值，从而放弃“-200px”命令。而且它不会恢复到正确的位置“margin-top:0”。即使我在 Firebug 中手动输入“0”，它在编辑控制台中也会显示“margin-top:0”，但它仍保持未指定的负值。当您单击“主页”返回起始页时，代码应重置为 margin-top：0 但是一旦按下红色链接，这将不起作用。恢复它的唯一方法是重新加载页面。

也许我错过了一些东西，但请看一看，让我知道。

4

1 回答 1

0

好的，所以看起来实际问题被伪装成它不是的东西。所有问题的原因都marginTop与 href 链接本身有关。他们似乎具有这种默认行为，可以在单击时将自己的位置（以及任何连接的 div）移动到屏幕/窗口的顶部。这引起了冲突。为了解决，从另一位成员那里看到了这个答案。只需将其添加到您的 href 链接：

<a href="#" onClick="return false;">The question?</a>

或者，如果您通过 JQuery 进行操作：

$('a[href="#"]').click(function(event){

    event.preventDefault();

});

此处的原始文章：单击链接时页面意外向上滚动

于 2012-11-08T22:48:41.080 回答