使滚动NavBar停留在Bootstrap中的浏览器顶部 [英] Make Scrolling NavBar Stick At Top Of Browser In Bootstrap

问题描述

我是Twitter Bootstrap的新手，想在深层MastHead的底部放置一个NavBar，并且当用户垂直滚动页面并且NavBar到达页面的顶部时，将样式更改为导航栏变为固定。我想要的效果仅使用Bootstrap NavBar与 http://www.happycog.com/ 相同。

I'm new to Twitter Bootstrap and want to have a NavBar at the bottom of a deep'ish MastHead and when the user vertically scrolls the page and the NavBar gets to the top of the page, change the style to so that the NavBar becomes Fixed. The effect I want is the same as http://www.happycog.com/ only using the Bootstrap NavBar.

真正的问题是，当NavBar滚动到位置0（即浏览器顶部）时，如何触发navbar-fixed-top样式。

So, the real question is how to trigger the navbar-fixed-top style when the NavBar is scrolled to position 0 ie: the top of the browser.

任何想法或建议将不胜感激。谢谢。

Any ideas or pointers would be appreciated. Thank you.

推荐答案

CSS类 navbar-fixed-top 是您想要添加的内容。

The CSS class navbar-fixed-top is what you want to add.

下面是一个示例：

<nav class='navbar navbar-inverse navbar-fixed-top sticky' role='navigation'>
    <!-- nav content -->
</nav>

这篇关于使滚动NavBar停留在Bootstrap中的浏览器顶部的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！