我遇到了类似的问题,我相信我找到了一种改进的解决方案。
不要
data-offset-top在HTML中指定内容。而是在调用时指定它
.affix():
$('#nav').affix({ offset: { top: $('#nav').offset().top }});这样做的好处是,您可以更改网站的布局而无需更新
data-offset-top属性。由于此操作使用元素的实际计算位置,因此还可以防止与将元素呈现在稍有不同的位置的浏览器不一致。
您仍然需要使用CSS将元素固定在顶部。此外,我必须设置
width: 100%自导航元素
.nav与元素
position:fixed胡作非为因为某些原因:
#nav.affix { position: fixed; top: 0px; width: 100%;}最后一件事:固定的元素固定后,它的元素不再占用页面上的空间,导致其下面的元素“跳转”。为了避免这种丑陋,我将导航栏包裹在一个
div高度上,该高度设置为在运行时等于导航栏:
<div id="nav-wrapper"> <div id="nav" > <!-- ... --> </div></div>
。
$('#nav-wrapper').height($("#nav").height());


