Question

我正在使用导航词缀在滚动时更改导航的背景。有两个独立的导航类，nav-affix和nav-affix-top。它似乎有效：

http://[redacted] （请指出错误）但由于某种原因，如果页面被重新加载，然后鼠标点击页面上的任何链接或滑块，导航将再次更改类和背景。任何关于为什么这是hapening的见解表示赞赏！

JS：

$(function() {

    $('#nav-wrapper').height($("#nav").height());
    $('#nav').affix({
        offset: { top: $('#nav').offset().top }
    });
});

CSS：

#nav.affix {
    position: fixed;
    overflow:visible;
    width:100%;
    background-image:url(../navbackground2.png);
}

#nav.affix-top {
    background-image:url(../navback1.png);
    margin-top:0;
}

Answer 1

这可能是Bootstrap的错误，请将以下代码放入您的javascript文件中：

$('#nav').on('affix.bs.affix', function() {
    if (!$(window).scrollTop()) return false;
});

这段代码将检查是否可以滚动到页面顶部。如果返回false，表示您已经在顶部，则不会更改导航栏的affix-top类。

Nav Affix背景图像更改

1 个答案: