3

我的页面内容周围有一个名为#Wrap 的 div，并编写了以下函数来向上移动所有内容，因此顶部的导航部分离开页面，并且我的内容有更多的屏幕空间：

$('.NavShrink').click(function(up) {
  $('#Wrap').animate({ top: '-=130px'});
  $(this).css('display', 'none');
  $('.NavExpand').css('display', 'block');
})

我还有以下内容可以再次将其恢复：

$('.NavExpand').click(function(down) {
  $('#Wrap').animate({ top: "+=130px"});
  $(this).css('display', 'none');
  $('.NavShrink').css('display', 'block');
})

我目前的问题是，当所有内容都移出屏幕时，页面似乎保持完整高度，这在我的内容底部创建了 130 像素的空白空间。这有什么办法？

我#Wrap目前只有这种风格position:relative;，但也尝试过，但height:100%;没有height:auto;运气。

编辑：这是页面：http ://www.emilekelly.com/TestFolder/index.html

4

1 回答 1

1

position: absolute上使用#wrap。

为什么？

因为相对于当前位置向上position: relative移动，#wrap但浏览器仍然考虑到它“应该”在下面的空间。

但是position: absolute会调整定位并将其脱离正常流程的上下文，从而折叠下面的内容，这就是您想要的 - 摆脱那个空间。

于 2012-10-09T11:04:22.320 回答