twitter bootstrap navbar导航后固定顶部重叠页面

时间:2013-12-12 11:34:43

标签: twitter-bootstrap

引导网站说

  

添加.navbar-fixed-top并记得考虑隐藏区域   通过添加至少40px填充到它下面。一定要添加   这是在核心Bootstrap CSS和可选响应之前   CSS。

我做到了。当页面首次显示或滚动到顶部时,它可以正常工作。

我还有一个附加的辅助导航栏,让您可以向下导航到可见页面的各个部分。

当页面向下滚动时,当链接的锚点位于顶部时,它会停止。但问题是:这是由导航栏覆盖的。因此,部分内容已被涵盖。

我尝试在导航后使用此功能进一步滚动页面:

window.scrollBy(0,-70);

但是这不起作用,它会混淆有时被移动的附加辅助导航栏。

如果使用固定在顶部的导航栏,如何链接到某个部分并完全显示?

我必须做一些非常错误的事情,因为这似乎是一个非常频繁的用例,我希望它可以开箱即用。

1 个答案:

答案 0 :(得分:5)

这个问题可以通过给锚定正填充和负边距来解决:

.anchor {
    padding-top: 73px;
    margin-top: -73px;
}

如下所述:Page scrolls to top also fixed navbar when external link opens Tab