Javascript изменить CSS атрибут фон фона nav (materializeCSS) - PullRequest
Новая
       6

Javascript изменить CSS атрибут фон фона nav (materializeCSS)

0 голосов
/ 08 июня 2018

Я пытался создать панель навигации с использованием materializeCSS и хочу изменить цвет фона при прокрутке.По какой-то причине я не могу заставить эту работу.Поскольку я использую MaterializeCSS, простое добавление и удаление другого класса в 'nav' не работает.Я ценю вашу помощь в этом.

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)');
      }
    });
  });

1 Ответ

0 голосов
/ 09 июня 2018 
  $(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 (например, поля, фона, рамки), хотя и работает в некоторых браузерах, не гарантируется.

...