Question

我有一个导航栏，当向下滚动时，它会改变颜色。它在开始时和滚动变为蓝色后都是透明的。我使用了以下js代码：

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

我的目的是在下拉菜单打开时也更改颜色（即添加“滚动”类）。

否则，如果我正在使用手机并且访问了该网站。.如果该网站没有滚动，则导航栏是透明的，下拉菜单也是一样，但是我想避免这种情况。

打开下拉菜单时，是否可以在此js代码中添加条件“添加类已滚动”？

非常感谢您，为这个简单的问题感到抱歉，但这是我第一次处理js。曼努埃尔

Answer 1

如果您在导航栏中添加了 bg-light 或任何 bg-* 类，则该类将不允许您显式设置背景色。尝试将类删除为；

HTML

<nav class="navbar navbar-expand-lg navbar-light fixed-top">

Css

<style>
    .scrolled {
        background-color: blue;
        color: white;
    }
</style>

确保选择正确的类选择器 “。navbar-fixed-top”

打开下拉菜单时更改导航栏颜色

1 个答案:

HTML

Css