滚动浏览时导航栏未切换为固定

Question

供参考的网址是http://buildme.co/

我目前在浏览主导航栏时无法切换到固定导航栏。 这是倾斜图像下的导航栏。

以下JavaScript代码应该可以做到这一点

// Change To Fixed Header
$(document).ready(function(){
    $(window).bind('scroll', function() {
        var navHeight = $( window ).height() - 100;
        if ($(window).scrollTop() > navHeight) {
            $('.main-navbar').addClass('navbar-fixed-top');
        }
        else {
            $('.main-navbar').removeClass('navbar-fixed-top');
        }
    });
});

但是事实并非如此，什么也没有发生。

这是我要实现的示例。 http://stanislav.it/tutorials/sticky-navigation/

Answer 1

看来您可能需要将滚动事件绑定到您的案例中的“ body”（当我在您的网站上对其进行检查时，窗口滚动事件并未触发，但body已激活）

编辑：哦，我想我看到了...这是您添加到html，body的溢出样式：

html, body {
    overflow-x: hidden;
    height: 100%;
}

如果我摆脱了overflow-x：隐藏的代码对我有用。 我知道我以前遇到过麻烦，因为它不允许一个轴允许溢出，而另一个不允许（所以如果您将overflow-x设置为：隐藏，则它可能会对y滚动产生有趣的作用）