Javascript更改导航的CSS属性背景（materializeCSS）答案

【问题标题】：Javascript change CSS attribute background of nav (materializeCSS)Javascript更改导航的CSS属性背景（materializeCSS）
【发布时间】：2018-06-08 20:20:53
【问题描述】：

我一直在尝试使用 materializeCSS 创建一个导航栏，并希望在滚动时改变背景颜色。由于某种原因，我无法完成这项工作。由于我使用的是 MaterializeCSS，因此仅向“导航”添加和删除另一个类是行不通的。感谢您在这方面的帮助。

HTML

<nav>
  <div class="nav-wrapper">
    <a href="#" class="brand-logo">Web</a>
    <a href="#" data-target="mobile-nav" class="sidenav-trigger">
      <div class="menu-icon"><i class="material-icons">menu</i></div>
    </a>
    <ul class="right hide-on-med-and-down">
      <li><a href="#">Home</a></li>
      <li><a href="#">Blog</a></li>
      <li><a href="#">Other</a></li>
      <li><a href="#">About</a></li>
      <li><a href="#">Contact</a></li>
    </ul>
  </div>
</nav>

CSS

  nav {
    position: fixed;
    background: rgba(0, 0, 0, 0.4);
  }

肯定有一些错误或我必须在下面做一些不同的事情。

  $(document).ready(function(){
    $(window).scroll(function(){
      if($(window).scrollTop()>200){
        $("nav").css('background','#000');
      }else{
        $("nav").css('background','rgba(0, 0, 0, 0.4)');
      }
    });
  });

【问题讨论】：

你加入了jQuery 吗？
如果您能提供fiddle 或同等名称，并使用链接更新您的帖子，那就太好了。

标签： javascript jquery materialize

【解决方案1】：

  $(function(){
    $(window).scroll(function(){
      var bgcolor = ($(window).scrollTop()>200)?'#000':'rgba(0, 0, 0, 0.4)';
      $("nav").css('background-color', bgcolor);
    });
  });

来自http://api.jquery.com/css/ 检索速记 CSS 属性（例如，边距、背景、边框）虽然适用于某些浏览器，但不能保证。

【讨论】：