jquery - 没有固定宽度的 Bootstrap 导航栏不会使自己变粘

Question

我在一些内容的中间有一个 twitter-bootstrap 导航栏，我想让它有粘性。

我正在使用 sticky jquery plugin , github page .

正如它在 github 页面中所说:

In some cases you might need to set a fixed width to your element when it is "sticked"

我已经尝试过这个并且:

• > Here is a non working example without a fixed width .
• > Here is a working example with a fixed width .

唯一的区别在于:

width:20px;

问题是我无法让它在我的导航栏上工作，当滚动时它会跳转到更小的宽度并保持原位。

参见示例 here .

不，现在我对如何解决这个问题感到矛盾，因为我对导航栏的外观很满意，添加固定宽度会破坏 twitter-bootstrap 功能吗？

另一个问题是，即使添加固定宽度，它也不会变粘。

Here is the example我添加的地方:

#stickynavbar{
    width:200px;
}

所以我的问题是:

• 如何解决这个特定问题或
• 由于元素处于早期阶段，也许另一个插件或开箱即用的解决方案对我来说同样有用。

无论指向正确方向的指针是什么，解决这个特定问题或使用完全不同的方法避免它们都可以。

Answer 1

为了避免修复代码，我推荐 hcSticky jQuery 插件。

实现很简单:$('selector').hcSticky();

实现这个插件后，你的代码看起来像THIS FIDDLE .