javascript - 使整个页面滚动到顶部的某个高度以下，没有任何滚动条

Question

html:

<div class="div_fixed"></div>

<div class="other_content">

content goes here
</div>

CSS：

.div_fixed{
position:fixed;
height:40px;

}

.other_content{

height:200px;

}

将div_fixed保持固定在页面的顶部位置。

但是随着页面向上滚动， div 的内容将在 divother_content的下边缘消失div_fixed。

在向下滚动的情况下，不可见的内容other_content将开始从下边缘可见div_fixed

如何做到这一点？

编辑：任何 div 都不应出现滚动条

score 2 · Accepted Answer

2

用于overflow: hidden摆脱滚动条

于 2012-08-02T09:11:23.037 回答

score 0 · Accepted Answer

我已经采用了您的 HTML/CSS 并在jsFiddle上添加了一些内容- 我认为为了实现您正在寻找的效果，您只需使您的内容实际上足够高以便可以滚动。在 200px 高和一行文本的情况下，什么都不会滚动。

所以我让你的other_contentdiv 更高，然后添加 atop: 0到你的.div_fixed选择器，让它保持在屏幕顶部，并margin-top: 40px添加到.other_contentdiv 以便让它从浮动 div 下方开始。

如果你希望它是一个导航栏类型的东西，你当然可以width: 100%在.div_fixed.

如果您愿意，所有这些都应该相当容易地转移到容器 div（带有position: relative）中，尽管您可能必须重新定位固定的 div。

score 0 · Accepted Answer

0

于 2012-08-02T09:55:06.347 回答

3 回答 3