Question

大家好，我的问题是我实现了一个导航栏，当用户滚动时，它会改变颜色，并且效果很好，我遵循了jsfiddle：https://jsfiddle.net/we9L9h2r/。

当它向下滚动时，它只有一个问题，它完美地改变了颜色，但是当它向上滚动时，它应该恢复起始样式，它仍然固定在向下滚动的颜色上

代码：

css：

tis:ti()

html：

.fixed-top.scrolled {
    background-color: #fff !important;
    transition: background-color 200ms linear;
}

.fixed-top.scrolled .nav-link {
    color:#555;
}

js：

<nav  class="navbar navbar-expand-lg navbar-dark  fixed-top lighten-3 d-block " id="navigation" >
...
</nav>

在用户到达网站后立即检查商品的情况

$(function () {
    $(document).scroll(function () {
        var $nav = $(".fixed-top");
        $nav.toggleClass('scrolled', $(this).scrollTop() > $nav.height());
    });
});

滚动后，即会添加滚动的类

<nav  class="navbar navbar-expand-lg navbar-dark  fixed-top lighten-3 d-block " id="navigation" >
...
</nav>

但是不幸的是，它并没有使我恢复透明，而是对我保持洁白，怎么会这样？

问题是我仍然在滚动类中，而css告诉他是#fff;从理论上讲，应该向上滚动时，应该删除滚动的类

CSS / JS |摇动时，导航栏不会再次更改颜色

0 个答案: