javascript - 带有边框的标题 - 边框只能通过滚动显示

Question

我已经用 bootstra4 编写了我的 index.html 并且有带边框的标题和粘性类。我希望仅在滚动页面时显示边框。

HTML

    <!-- TOP NAV -->
    <header id="topNav">
        <div class="container">
      .....

</div>

CSS

#header.shadow-after-3:before {
    content: ' ';
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 60px;
    bottom: -60px;
    background-image: url(../images/misc/shadow3.png);
    background-size: 100% 100%;
}

JS

我的js代码不会在这里插入-如果是必要的我会再试一次

Answer 1

使用 Javascript 您可以轻松解决。

$(window).scroll(function() {
    if ($(this).scrollTop() > 250){  
        $('header').addClass("borderClass");
    }
    else{
        $('header').removeClass("borderClass");
    }
});