javascript - 使引导菜单在加载时可见

Question

我对 Boostrap 了解不多，我尝试在网上找到答案但没有成功。

我正在为我工​​作的小公司建立一个基于以下模板的网站:

https://dcrazed.com/bent-app-landing-page-template/

我已经自定义了一些布局的文本，但我的老板希望菜单栏始终可见。在模板中，当您开始向下滚动时，栏会出现，并且始终隐藏在主页上。通过更改脚本的 If 条件，我设法让它出现并在第一次滚动后保持不变。

//菜单出现和隐藏$(文档).ready(函数() {

"use strict";

$(window).scroll(function() {

    "use strict";

    if ($(window).scrollTop() > 1000) {
        $(".navbar").css({
            'margin-top': '0px',
            'opacity': '1'
        })
        $(".navbar-nav>li>a").css({
            'padding-top': '15px'
        });
        $(".navbar-brand img").css({
            'height': '35px'
        });
        $(".navbar-brand img").css({
            'padding-top': '0px'
        });
        $(".navbar-default").css({
            'background-color': 'rgba(59, 59, 59, 0.7)'
        });
    } else {
        $(".navbar").css({
            'margin-top': '0px',
            'opacity': '1'
        })
        $(".navbar-nav>li>a").css({
            'padding-top': '15px'
        });
        $(".navbar-brand img").css({
            'height': '35px'
        });
        $(".navbar-brand img").css({
            'padding-top': '0px'
        });
        $(".navbar-default").css({
            'background-color': 'rgba(59, 59, 59, 0.7)'
        });

    }
});

});

即使改变了 If 的条件，它仍然需要至少一个滚动条才能出现。

Answer 1

如果您添加 trigger('scroll')，您应该能够立即看到它。

$(window).scroll(function(){  
  // some code
}).trigger('scroll')