更改滚动时菜单的高度

Question

当我向下滚动以最小化菜单的高度时，我想要我的网站。例如，我的标题固定在顶部，高度：150px。当我向下滚动时，我想调整高度：50px。

我正在使用bootstrap 3。所以我的标头的类是.navbar .navbar-fixed-top .

你能告诉我该怎么做吗？

Answer 1

这是简单的 jquery 解决方案。

$(window).scroll(function (event) {
        var y = $(this).scrollTop(); //set position from top when to change style in pixels
        if (y >= 300) {
            $('#header').addClass('resized');
        } else {
            $('#header').removeClass('resized');
        }
    });

CSS：

.resized {
    height:50px !important;
}

JSFiddle