CODEWITHSUNDEEP
javascriptjqueryhtmlcssmmenu
MJH
MJH

Reputation: 859

mmenu not working, looks like regular html

I wrote an html page just to try the mmenu in visual studio. When I run the code, before clicking open the menu, all I see is regular html. Clicking open the menu doesn't do anything. enter image description here

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="JS/jquery-1.11.3.min.js"></script>
    <script src="JS/jquery.mmenu.all.min.js"></script>
    <link href="CSS/jquery.mmenu.all.css" rel="stylesheet" />
</head>
<body>
    <div>
        <a href="#myMenu">Open the menu</a>
        <nav id="myMenu">
            <ul>
                <li><a href="#">Sign up</a></li>
                <li>
                    <a href="#">Enter</a>
                    <ul class="vertical">
                        <li><a href="#">Log in</a></li>
                        <li><a href="#">Continue as guest</a></li>
                    </ul>
                </li>
            </ul>
        </nav>
   </div>

    <script type="text/javascript">
    $(document).ready(function () {
        $("#my-menu").mmenu({
            // Options
        });

    });
    </script>
</body>
</html>

in my project I have these files:

JS

  1. jquery-1.11.3.min.js
  2. jquery.mmenu.all.min.js

CSS

  1. jquery.mmenu.all.css

I am not connected to the internet when I run the code. Do I have to be using Sass? I saw it mentioned somewhere in the mmenu site, but have no idea what that is.

Upvotes: 0

Views: 142

Answers (1)

Raghu
Raghu

Reputation: 1009

As per mmenu docs,

"The plugin automatically binds a click event that opens the menu to every A element that links to the menu."

For this purpose you must use the menu's id in the href attribute of the trigger element.

<a href="#myMenu">Open the menu</a>
  <nav id="myMenu">
  </nav>

Fiddle Demo

Upvotes: 1

Related Questions