jquery - 我无法使滚动功能正常工作

Question

我想在向下滚动时为某些类提供一些 css 属性。我有一个代码如下所示。问题是，第一个和最后一个 'if' 有效(.second-nav 清楚地上下滑动)但 .css 代码不起作用。这些类没有得到我编写的 css。我应该如何维护该代码？

$(window).scroll(function() {

    var scrollPos = $(window).scrollTop();

    if (scrollPos>200){
        $( ".second-nav" ).slideDown();
    }
    /* not-working area starts here*/
    else if (scrollPos>690){
        $('.who-btn').css("border-bottom", "5px solid #25bdad");
    }
    else if (scrollPos>1415){
        $('.difference-btn').css("border-bottom", "5px solid #25bdad");
    }
    else if (scrollPos>1995){
        $('.brands-btn').css("border-bottom", "5px solid #25bdad");
    }
    else if (scrollPos>3604){
        $('.contact-btn').css("border-bottom", "5px solid #25bdad");
    }
    /* lol this works */
    else if (scrollPos < 199){
        $( ".second-nav" ).slideUp();
    } 
});

Answer 1

每个“else if”都覆盖了前一个“if”中的语句。您需要执行以下操作:

if (scrollPos <= 200)
{
    $( ".second-nav" ).slideUp();
}
else if (scrollPos >= 690 && scrollPos <= 1414){
    $('.who-btn').css("border-bottom", "5px solid #25bdad");
}