Navbar延迟词缀到顶部

Question

出于某种原因，只有在页面几乎完全加载后，导航栏才会将自己固定在顶部。这会产生一个不寻常的暂停，导航栏浮动的位置比页面顶部略低，而没有添加格式属性。

我发布了源代码，但我真的不确定这个错误的原因是什么，我不能指出一行特定的代码。我使用的是标准的Bootstrap样板，我的网站的其余部分源代码可以通过标准的“View Page Source”方法找到（我编辑的CSS在“css / main.css”下）。

http://www.radioairlift.org

谢谢！

Answer 1

加载和处理bootstrap javascript时出现延迟。 Bootstrap正在为你的导航添加“词缀”类，它将位置从“相对”更改为“固定”（以及其他一些属性）。

您可以将“affix”类添加到HTML源代码中的#nav，并避免样式中的更改。

Answer 2

幸运的是，您不需要使用Bootstrap Affix插件来执行您想要的操作！在Bootstrap 2.3.2中有类 .navbar-fixed-top 。引用their docs:

  

添加.navbar-fixed-top并记住通过添加至少40px填充来计算其下方的隐藏区域。一定要在核心Bootstrap CSS之后和可选的响应式CSS之前添加它。

所以你要做的就是从 #nav 中删除 .affix 类并删除要添加的位置：relative 在你的CSS文件中导航id。