javascript - 你如何将 headroom.js 与 Bootstrap 3 导航栏一起使用？

Question

我找到了这个 JavaScript 小部件 http://wicky.nillia.ms/headroom.js/我想在使用 Bootstrap 3 的 Web 应用程序中使用它。它似乎不起作用。有什么建议或例子我应该做什么？

我目前在导航栏上使用 navbar-fixed-top。我尝试过使用和不使用它，但它仍然无法正常工作。我可以看到应用于页眉的 headroom.js 类，但对 UI 元素没有影响。

---

已解决

你需要添加这个样式。

<style type="text/css">
.headroom {position: fixed;top: 0;left: 0;right: 0;transition: all .2s ease-in-out;}
.headroom--unpinned {top: -100px;}
.headroom--pinned {top: 0;}
</style>

来源:http://codeasp.net/blogs/raghav_khunger/microsoft-net/2314/how-to-use-headroom-js

Answer 1

我找到了问题的解决方案。您需要添加此样式。

<style type="text/css">
.headroom {position: fixed;top: 0;left: 0;right: 0;transition: all .2s ease-in-out;}
.headroom--unpinned {top: -100px;}
.headroom--pinned {top: 0;}
</style>

来源:http://codeasp.net/blogs/raghav_khunger/microsoft-net/2314/how-to-use-headroom-js

谢谢 Fox Genki获取源链接​​。