Question

当顶部菜单打开时，我试图使我的body元素下降12em。我经历了一些与我相似的答案，但是没有运气。它没有中断，但似乎也没有运行。有人知道我在做什么错吗？

   var w = window.innerWidth;

    if ( w < 991.98 && $('#mainNav').hasClass('header-active') ) {
      console.log("hello")
       $('#target').addClass('body-active');
   } else {
       $("#target").removeClass("body-active");
   };

<!--body tag top and nav-->
   <body id="target">

<!-- Page Content -->
<div class="jumbotron jumbotron-fluid hero">
  <!-- Navigation -->
  <header class="masthead d-flex justify-content-center">
   <nav class="navbar navbar-expand-lg fixed-top" id="mainNav">
     Nav</a>
     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
       <i class="fas fa-bars fa-inverse"></i>
     </button>
     <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
       <div class="navbar-nav">
         <a class="nav-item nav-link active" href="#">Home <span class="sr-only">(current)</span></a>
         <a class="nav-item nav-link" href="#">Features</a>
         <a class="nav-item nav-link" href="#">Pricing</a>
         <a class="nav-item nav-link disabled" href="#">Disabled</a>
       </div>
     </div>
   </nav>

.header-active {
   background-color: $blk !important;
  }
.body-active {
   margin-top: 12em;
 }

谢谢！

当存在一定的屏幕宽度和类别时，请执行某些操作

0 个答案: