HR Navigation Responsive Menu [v1.4]

HR Navigation Responsive Menu for all type of Web Applications with very less code and easy to implement with all possible options.

Features

• Responsive all devices support
• Handle events with two options (click and mouseover)
• All major browsers compatible
• Toggle from left side and top side
• Multilple open menu option (open one at a time or multiple)
• Equal width of menu list on desktop
• Custom speed option
• LESS compatible
• Lightweight js only (2 kb)

Documentation

HTML

Required Files

<link rel="stylesheet" href="hr.nav.res.menu.min.css">
<script src="1.11.2.jquery.min.js"> </script>
<script src="hr.nav.res.menu.min.js"> </script>

HTML

<nav class="hr-nav-wrapper">
		<div class="navigation hr-navigation">
			<ul>
				<li> <a href="#">Nav 1</a > </li>
				<li> <a href="#">Nav 2</a > </li>
			</ul>
		</div>
	 </nav>

jQuery

	$(".hr-nav-wrapper").hrNavMenu({ 
		speed:800, //integer in milliseconds  1000,2000
		menuType :"fromLeft", //fromLeft, fromTop
		desktopListWidth : "fluid", // fluid, default
		openEvent : "click", //click, mouseover
		multiple  : false // true, false

	});

Checkout Demo

Author

if you've any more idea or suggestions please share me on 👉 hidaytrahman@gmail.com

If you like my work buy me a cup of coffee to show support 😊

---

Logs (v1.4)

What's New

LESS Compatibility

UI Changes

---

Multiple option Added (v1.2)

Added minified css and js

Multiple Expand Menu

Single Expend Menu