I’ve created this drop down menu that works on click, but the first drop box stays open when you click on the next link.
Also how do you close the menu when a child is clicked as I’m pulling the content from a database and the page does not refresh.
$(document).ready(function(){
$("#top-nav li").toggle(function(){
$("ul",this).show();
$("a.top-nav-link", this).addClass('selected');
}, function(){$('ul',this).hide();
$("a.top-nav-link", this).removeClass('selected');
}); });
<ul id="top-nav">
<li>
<a href="#" class="top-nav-link">INDIAN</a>
<ul>
<li>
<div class=" one-wrap set-column">
<a href="#" >INDIAN</a>
<a href="#" >CHINESE</a>
<a href="#" >ITALIAN</a>
<a href="#" >PUB FOOD</a>
<a href="#" ></a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
</div>
</li>
</ul>
</li>
<li>
<a href="#" class="top-nav-link">CHINESE</a>
<ul>
<li>
<div class=" two-wrap set-column">
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
<a href="#" >Menu</a>
</div>
</li>
</ul>
</li>
You can close all existing drop-down menus when a link is clicked, then slide down the one that should slide down now:
Regarding your 2nd question, if you want the parent menu to fold up when one of the links from within the menu is clicked, do this:
You can use
on, the recent version oflive, which is now depreciated.