LOADING...

Preview

Pen ID
Unlock Campus Themeforest adv

 

Code




CSS
.equinav .navbar-brand {
	display: none;
}
.equinav .navbar-collapse {
	padding: 0 !important;
}

.equinav-collapse .navbar-header {
	float: none;
}
.equinav-collapse .navbar-brand,
.equinav-collapse .navbar-toggle {
	display: block !important;
}
.equina-collapse .navbar-collapse {
	border-top: 1px solid #e7e7e7 !important;
}
.equinav-collapse .navbar-collapse.collapse {
	display: none !important;
}
.equinav-collapse .navbar-nav {
	float: none !important;
	margin: 0 !important;
}
.equinav-collapse .navbar-nav > li {
	width: auto !important;
	float: none !important;
}
.equinav-collapse .navbar-nav > li > a {
	text-align: left !important;
	padding-top: 10px !important;
	padding-bottom: 10px !important;
}
.equinav-collapse .navbar-collapse,
.equinav-collapse .navbar-collapse.collapse.in {
	border-top: 1px solid #e7e7e7 !important;
	display: block !important;
}
.equinav-collapse .collapsing {
	overflow: hidden !important;
}
.equinav-collapse .dropdown-toggle {
	background-color: #e7e7e7 !important;
}
.equinav-collapse .dropdown-toggle > .caret {
	display: inline-block !important;
}
.equinav-collapse .dropdown-menu {
	background: none !important;
	float: none !important;
	border: 0 !important;
	box-shadow: none !important;
	position: relative !important;
}
.equinav-collapse .navbar-nav .open .dropdown-menu {
	display: block !important;
}
.equinav-collapse .navbar-nav .open .dropdown-menu > li > a,
.equinav-collapse .navbar-nav .open .dropdown-menu .dropdown-header {
	color: #777 !important;
	padding: 5px 15px 5px 25px !important;
}
JS
var breakpoint = 0;
		
		// Function to set equinav breakpoint
		function equiNavBreakpoint () {
			$('.equinav ul.navbar-nav > li').each(function(){ breakpoint += $(this).innerWidth(); }); //add up all menu items width for breakpoint
		}
		
		equiNavBreakpoint();
		
		// Function to apply equinav menu
		function equiNavMenu () {
			
			$('.equinav ul.navbar-nav > li').removeAttr('style');
			
			var mq = window.matchMedia('(min-width: 768px)');
			
			var nav = $('.equinav').innerWidth(); // Navbar Width
			var items = $('.equinav ul.navbar-nav > li').length; // Total number of menu items
			var space = nav - breakpoint; // Empty navbar space
			var spacer = parseInt(space / items); // Number of pixels to spread out to individual menu items. Since decimal places is not good with pixels we have to use parseInt.
			var xspace = nav - (breakpoint + (spacer * items)); // The remaining space after getting the spacer with parseInt
			var xspacer = Math.ceil(xspace / items); // The remaning number of pixels to distribute to menu items
			
			var num = 0;
			
			if (mq.matches) {
			
			  if (nav > breakpoint) {
				
					$('.equinav').removeClass('equinav-collapse');
					
					if (breakpoint == 0) equiNavBreakpoint();
					
					$('.equinav ul.navbar-nav > li').each(function(){
						
							$(this).css({'width':'auto'});
							
							var itemwidth = 0;
							itemwidth = (num < xspace) ? ($(this).innerWidth() + spacer) + xspacer : $(this).innerWidth() + spacer;
							
							$(this).css({'width':itemwidth+'px'});
							
							num++;
							
							if ( $(this).find('.dropdown-menu').length != 0 ) {
								if (num == items) $(this).find('.dropdown-menu').addClass('pull-right');
								if ($(this).find('.dropdown-menu').innerWidth() < $(this).innerWidth()) $(this).find('.dropdown-menu').css({'width':$(this).innerWidth()+'px'});
							}
					});
					
				} else {
					
					$('.equinav').addClass('equinav-collapse');
					$('.equinav ul.navbar-nav > li > .dropdown-menu').removeAttr('style');
					
				}
				
			} else {
			  	
				$('.equinav').addClass('equinav-collapse');
				$('.equinav ul.navbar-nav > li > .dropdown-menu').removeAttr('style');
				
			};
		}
		
		equiNavMenu();
		
		$(window).resize(function(){
			equiNavMenu();
		});
Host Instantly Drag and Drop Website Builder

 

Wed, 11/29/2017 - 11:18

Related Codes

Pen ID
Pen ID
Pen ID