Amazon Like Multi-Level Mega Menu Plugin For jQuery - Amazon Side Bar Menu

Amazon Side Bar Menu is a jQuery plugin used to create a responsive multi-level mega menu like Amazon's.

How to use it:

1. Include the jQuery javascript library and jQuery amazon side bar menu plugin's files in the Html document.

<link rel="stylesheet" type="text/css" href="amazonmenu.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="amazonmenu.js">

2. Create a multi-level mega menu using nested unordered lists.

<nav id="demo" class="amazonmenu">
<ul>
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a>
<div>
<ul>
<li><a href="#">Item 2.1</a></li>
<li><a href="#">Item 2.2</a></li>
<li><a href="#">Item 2.3</a></li>
<li><a href="#">Item 2.4</a></li>
<div>
<p>
Item 2.4.1
</p>
<p>
Item 2.4.2
</p>
<p>
Item 2.4.3
</p>
</div>
<li><a href="#">Item 2.5</a></li>
</ul>
</div>
</li>
</ul>
</nav>

3. Initialize the mega menu.

<script>
jQuery(function(){
amazonmenu.init({
menuid: 'demo'
})
})
</script>

4. Default options.

<script>
jQuery(function(){
amazonmenu.init({
animateduration: 100,
showhidedelay: [100, 100],
hidemenuonclick: true
})
})
</script>

---

This awesome jQuery plugin is developed by dynamicdriverepo. For more Advanced Usages, please check the demo page or visit the official website.