我得到了它的一部分工作。但由于某种原因,它不会保持在顶部。
CSS 导航框:
#navbox {
float: left;
width: 150px;
border: 1px solid blue;
border: thin solid #CCC;
background-color: #FFF;
border-radius: 4px;
padding: 5px;
position: fixed;
top: 92px;
z-index: 1000;
}
HTML 代码:
<div id="navbox">
<div class="navigation">
<a href="#aeast">AFC East</a> <br />
<a href="#anorth">AFC North</a> <br />
<a href="#asouth">AFC South</a> <br />
<a href="#awest">AFC West</a> <br />
</div>
</div>
当它没有滚动时。
当我滚动时
我猜这与 top
有关。
它在一个中间部分的容器中。
容器是:
#container {
width: 870px;
margin-top: 12px;
margin-left: auto;
margin-right: auto;
}
最佳答案
此处唯一的选择是使用 JavaScript 在使元素 position: fixed;
之前确定滚动位置。我推荐ScrollToFixed因为它支持边界和边距。
更新:
您可以使用 position: sticky;
(以及浏览器前缀)[ reference ] 为了以更有创意的方式做到这一点,尤其是针对 iOS 修复它。
关于jquery - 位置固定栏确实滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21997162/