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:
| mnmenu | Function | Initiate menu on list |
Screenshots:
