溢出，固定元素和滚动条的噩梦

Question

我有一个包含大量内容的经典页面，以及一个打开弹出窗口的按钮。这个pop的高度比我的窗口大，所以我需要在弹出窗口内滚动。当我隐藏我的触发器时，我希望与显示此弹出窗口之前的滚动位置完全相同。我尝试了很多解决方案，而且......不完全是这样:)你可以在JSfiddle上看到一个例子：http://jsfiddle.net/S6EFW/11/ 我关闭了，但滚动条在菜单下面，我不知道如何修复...... :(

您可以在今日美国网站上看到我想要做的事情：http://www.usatoday.com/

如果您滚动一下，然后单击其中一篇主文章，则会显示一个弹出窗口。您可以在此弹出窗口中滚动。当您关闭弹出窗口时，您将在页面的相同位置上打开弹出窗口。

我试过用：

  overflow-y:scroll;

但我仍然有滚动条和固定菜单的问题...... :(

如果你有想法实现这一点！

Answer 1

对于#content尝试使用margin代替padding：

#content {
  margin-top : 100px;
  padding-top:10px;
}

选中 http://jsfiddle.net/S6EFW/18/

Answer 2

将z-index:-999;添加到您的#hello

所以：

#hello {
    position : absolute;
    top : 0px;
    width : 100%;
    height : 100px;
    background-color : #123456;
    z-index:-999;