-1

I was just trying to test out this responsive nav bar, but it seems that the javascript is not connecting. I put the script tag at the bottom of the body as I've heard that it is the best place to put it, yet it fails to work.

index.html

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Omnii</title>
    <link rel="stylesheet" href="index.css">
    
</head>
<body>
    <section class="navigation">
        <div class="nav-container">
          <div class="brand">
            <a href="#!">Omnii</a>
          </div>
          <nav>
            <div class="nav-mobile"><a id="navbar-toggle" href="#!"><span></span></a></div>
            <ul class="nav-list">
              <li>
                <a href="#!">Home</a>
              </li>
              <li>
                <a href="#!">About</a>
              </li>
              <li>
                <a href="#!">Devs</a>
              </li>
              <li>
                <a href="#!">Docs</a>
              </li>
              <li>
                <a href="#!">Sign in</a>
              </li>
            </ul>
          </nav>
        </div>
      </section>

      <section>
          <center><h1>Reality, enhanced</h1></center>
      </section>
      <script src="index.js"></script>
</body>
</html>

index.js

(function ($) {
  $(function () {
    //  open and close nav
    $("#navbar-toggle").click(function () {
      $("nav ul").slideToggle();
    });

    // Hamburger toggle
    $("#navbar-toggle").on("click", function () {
      this.classList.toggle("active");
    });
  });
})(jQuery);

What do I do?

Milly Alfaro
  • 299
  • 3
  • 15

1 Answers1

1

I can see you are using the dollar($) sign which means jQuery needs to be included first before add the index.js file. NB: The order should be jQuery first then follows by your custom index.js file

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="index.js"></script>
Oketa Fred
  • 36
  • 4