mnmenu: JQuery plugin to create dropdown menus from ul lists.

Mmenu is a JQuery plugin to create dropdown menus from ul lists.

This is a very simple and straightforward plugin. It’s still a work in progress project with more features to come, so check for updates to see what’s new in upcoming versions.

The aim of the project is to create a very simple to style dropdown menu. You can create a totally styled menu in less than 100 line css sheet.

MNMenu is now responsive, menu will collapse when top level is not visible in the device screen.

Download: https://github.com/manusa/mnmenu

Demonstration: https://www.marcnuri.com/en/content/mnmenu-dropdown-jquery-menu

Plugin homepage: https://www.marcnuri.com/en/content/mnmenu-dropdown-jquery-menu

Implementation:

1. FIRST, INCLUDE THE CSS & JQUERY FILES

<!-- include CSS & JS files -->
<!-- CSS file -->
<link rel="stylesheet" type="text/css" href="mmenu.css" media="screen" />
<!-- jQuery files -->
<script type="text/javascript" src="jquery.js"></script>
<script src="jquery.mnmenu.js" type="text/javascript"></script>

2. ADD YOUR HTML

<ul>
    <li>First Level
        <ul>
            <li>Second Level</li>
            <li>...</li>
        </ul>
    </li>
    <li><a href="#">First level as link</a></li>
</ul>

3. NOW, CALL THE MMENU PLUGIN

<script type="text/javascript">
$(document).ready(function(){
   $('#idmenu').mnmenu();
});
</script>

Methods:

Screenshots: