响应式导航栏不会显示

Question

解决了 我已经创建了一个自定义的导航栏，我决定对其进行响应。

但是，当我单击小“栏”图标时，响应性导航栏将不会显示吗？源代码：https : //jsfiddle.net/spoktry9/

  <nav>

    <div class="toggle">

        <i class="fas fa-bars menu" aria-hidden="true"></i> 

    </div>

    <ul>

      <li><a href="index.html" class="active">Home</a></li>

      <li><a class= "menu" href="menu.html">Menu</a></li>

      <li><a class= "info" href="info.html">Info</a></li>

      <li><a class= "reserve" href="reserve.html">rReserve</a></li>    

      <li><a class= "pics" href="pictures.html">Pictures</a></li>

      <li><a class= "contact" href="contact_index.html">Contact</a></li>

        <div class = "login">

    <a href="login.html"><img src="img/login.png" heigt= "75" ;></a>

  </div>

    </ul>

  </nav>

Answer 1

您在jQuery上有解析错误：$(document).ready(function(){&nbsp; &nbsp; $('.toggle').click(function(){&nbsp; &nbsp; &nbsp; &nbsp; $('ul').toggleClass('active');&nbsp; &nbsp; }}它应该是 ：$(document).ready(function(){&nbsp; &nbsp; $('.toggle').click(function(){&nbsp; &nbsp; &nbsp; &nbsp; $('ul').toggleClass('active');&nbsp; &nbsp; });})colorCSS上的属性使该栏不显示，只需将其设置为另一种颜色（color:#000;）或直接将其取下即可。另外，请确保在HTML代码上链接了jQuery库。JSFiddle演示