Jump to content

hamburger menu still active when menu bar isn't open


Doubleshot_84

Recommended Posts

The menu bar links are active even when the menu bar is closed. I know the problem has to be in the javascript. I don't know javascript, how do you turn off the nav when the menu bar isn't open? I attached sample code so you can see the problem yourself.

$(document).ready(function(){	/*  Hamburger Menu  */	$('.hamburger').on('click', function(e){				e.preventDefault();		$(this).toggleClass('opned');		$('header nav').toggleClass('active');	});

sample code.zip

Edited by Doubleshot_84
Link to comment
Share on other sites

I edited my original post and attached sample code. Now I'm thinking the problem is in the CSS.

@media (max-width:800px){	header a.hamburger{ display: block;}	header nav{		position: absolute;		opacity: 0;		width: 95%;		top: 95px;		right: auto;		left: auto;		height:auto;		float: center;		z-index: 20;		overflow: hidden;		background: #fff;		border-top: 5px solid #bfd9f2;		-webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2);		-moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2);		box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2);}	header nav.active{		opacity: 1;}	header nav ul{		display: block;		width: 100%;		text-align: center;		margin-top: 0;}	header nav a{		text-decoration: none;		text-align: center;		display: inline;		color:#808080;		list-style: none;}	header nav ul li a{		display: block;		padding: 25px 0;		border-bottom: 1px solid #f2f3f3;		transition: background .2s linear;		-webkit-transition: background .2s linear;		-moz-transition: background .2s linear;		-o-transition: background .2s linear;}	header nav ul li a:active{		background: #f2f3f3;}	header nav ul li a,{		color: #1c3655;}}
Link to comment
Share on other sites

To clarify, is this issue happening on page load too, or are the links only showing as active after you click to close the hamburger menu.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...