troubleshooting Question

[Bootstrap] Navigation Bar Collapse

Avatar of eugene007
eugene007 asked on
CSSAngularBootstrap
27 Comments1 Solution1192 ViewsLast Modified:
The code below is a responsive top navigation bar and upon clicking on the menu link it collapse. However there is a problem whereby when I click on "Maintenance" it collapses. By right it is suppose to collapse when I select options below the "Maintenance".

header.php

		<div class="navbar navbar-default navbar-fixed-top" role="navigation">
		   <div class="container">
			 <div class="navbar-header">
			  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 	
				<span class="sr-only">Toggle navigation</span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
			  </button>
			  <a class="navbar-brand">logo</a>
			 </div>
			 <div class="navbar-collapse collapse">
			 <ul class="nav navbar-nav navbar-right">
			  <li><a href="#!/Employee">Employee</a></li>
			  <li><a href="#!/User">User</a></li>
			  <li class="dropdown">
				  <a class="nav-link dropdown-toggle" data-toggle="dropdown" role="button">Maintenance<b class="caret"></b></a>
				  <ul class="dropdown-menu">
					<li class="dropdown-header">Admin & Dashboard</li>
					<li><a href="#!/Employee">Employee</a></li>
					<li><a href="#!/User">User</a></li>
					<li class="divider"></li>
					<li class="dropdown-header">Portfolio</li>
					<li><a href="#!/Employee"></a></li>
					<li><a href="#!/Employee"></a></li>
				  </ul>
			   </li>
			   <li><a href="#!/Employee">Contact</a></li>
			 </ul>
			 </div>
			</div>
        </div>
		<br/><br/><br/><br/>

EmployeeController.js

    $('.nav a').on('click', function(){
		$(".navbar-collapse").collapse('hide');
    }); 

Apart from that, Are there ways to prevent this menu from overlapping on my contents.
Join the community to see this answer!
Join our exclusive community to see this answer & millions of others.
Unlock 1 Answer and 27 Comments.
Join the Community
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 27 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros