Bootstrap：导航在开始时不固定，然后固定答案

【问题标题】：Bootstrap: navigation not fixed at the begin, and then fixedBootstrap：导航在开始时不固定，然后固定
【发布时间】：2017-01-12 06:50:13
【问题描述】：

我想知道是否可以使用引导程序创建带有徽标和其他信息的标题，然后是导航栏。但是徽标不会固定，只有导航栏会位于页面顶部。 Here an example of header i'm trying to do with bootstrap

【问题讨论】：

标签： twitter-bootstrap-3 header fixed nav

【解决方案1】：

感谢您的回答，但我认为这不是我的问题，我认为我的解决方案与 jumbotron 无关。

如果您查看我在下面提供的链接，您会看到网站 (w3school.com) 的徽标在我们位于页面顶部时位于顶部。当我们向下滚动时，这个标志会消失，只有导航栏（home、html、css、...）会留在顶部。

【讨论】：

【解决方案2】：

这部分取决于“标题”的含义。

“jumbotron”类通常用作这样的标题：

<div class="jumbotron"><img src='logo.png'>My Cool Company</div>

而且导航栏是一个独立的元素，具体来说就是一个导航栏。它可以固定在页面上（随内容滚动）或静态在屏幕上（停留在顶部或底部）

Nabber 示例（始终位于顶部）：

<nav class="navbar navbar-fixed-top navbar-light bg-faded">
  <a class="navbar-brand" href="#">Fixed top</a>
  <a href="#">Link 1</a>
  <a href="#">Link 2</a>
</nav>

您可以在导航栏的引导页面上找到其他详细信息：
Bootstrap Components navbar Placement

并且这个例子中的位置是“navbar-fixed-top”，所以它保持在屏幕的顶部，即使在滚动时也是如此。

您可能还希望在标题下进行导航，并希望两者都滚动，直到导航栏到达屏幕顶部，然后将其固定在顶部。这有时被称为粘性导航栏。可以用jQuery来完成，但是目前不知道在Bootstrap中没有添加自定义javascript的方法。

Sticky Menu in jQuery - answer

如果您确实想要第二个选项，不使用 jQuery，请询问另一个问题，即当滚动超过屏幕顶部时，如何使用 Javascript 从 Fixed 切换到 Static。

【讨论】：