在zendesk.com上创建一个“浮动”顶部导航？

Question

我想创建一个像here上看到的“浮动”顶部导航。

当向下滚动页面时，顶部导航当然会从浏览器窗口中消失，但它会回到视图中，并一直保持在最顶层。

我可以看到CSS在div#nav-bar-content处正在发生变化，但我无法弄清楚这些样式何时应用于JavaScript。

如果某人有指向如何使用jQuery实现它的指针，或者在Zendesk源代码中我可以找到一个这样的示例，那就太棒了。

非常感谢你！

关心Kim

Answer 1

您应该在每个scroll事件中重新定位菜单。

<div class='menu'>Menu content</div>

---

$(window).scroll(function(e) {

    if ($(window).scrollTop() > 20) // 20 - offset from the top
        $('.menu').css({
            position: 'fixed',
            top: '0'
        });
    else
        $('.menu').css({
            position: 'static'
        });
});

UPDATE：使用CSS的静态解决方案：

div.menu {
    position: fixed;
    top: 10px;
    z-index: 5000;
}