Fullscreen Navigation with Animated Burger Toggle Using jQuery - fatNav
| File Size: | 24.7 KB |
|---|---|
| Views Total: | 14872 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
fatNav is a minimalist jQuery navigation menu to create an animated hamburger toggle that reveals a fullscreen navigation menu with zoomIn & zoomOut animations.
How to use it:
1. Import jQuery library and the jQuery fatNav plugin's stylesheet & JavaScript into your web page.
<link href="dist/jquery.fatNav.css" rel="stylesheet"> <script src="//code.jquery.com/jquery-2.1.3.min.js"></script> <script src="dist/jquery.fatNav.js"></script>
2. The html to create a normal navigation menu.
<div class="fat-nav">
<div class="fat-nav__wrapper">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Category</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">About</a></li>
</ul>
</div>
</div>
3. Call the plugin and we're done.
$.fatNav();
This awesome jQuery plugin is developed by Glitchbone. For more Advanced Usages, please check the demo page or visit the official website.











