jquery - Hamburger menu to close upon clicking links -
i have created simple hamburger menu close when click on 1 of links not know how this. html is:
<nav> <div class="nav_top"> <div class="nav_logo"> <img src="images/nav_logo.png"> </div> <!-- end of nav_logo --> </div> <!-- end of nav_top --> <div class="hamburger" id="hamburger"> <img src="images/hamburger.svg"> </div> <div class="list-items"> <ul> <li><a href="#welcome">welcome</a></li> <li><a href="#venue">venue</a></li> <li><a href="#accommodation">accommodation</a></li> <li><a href="#gifts">gifts</a></li> <li><a href="#weekend">weekend</a></li> <li><a href="#rsvp">rsvp</a></li> </ul> </div> </nav> <!-- end of navigation section -->
my jquery is:
jquery(function($){ $( '.hamburger' ).click(function(){ $('.list-items').toggleclass('expand') }) })
is there simple can add jquery work? cheers
try using bootstrap dropdown, has functionality inherently built in: http://getbootstrap.com/components/#dropdowns
example:
<ul class="user-dropdown navbar-right"> <li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" href="#"> <i class="fa fa-lg fa-navicon" title="menu"></i> </a> <ul class="dropdown-menu"> <li class="dropdown-header user-dropdown-header"> header </li> <li> <a href="/index" class="link">all</a> </li> <li class="divider"></li> <li> <a href="/new" class="link">new</a> </li> </ul> </li> </ul>
no js hacks required
Comments
Post a Comment