jQuery Arrays on a menu -


i'm using html structure similar this

<ul class="top-level">    <li><a href="#"></a>        <ul class="dropdown">           <li><a href="#"></a>           </li>        <ul>    <li> </ul> 

with jquery this

$(".top-level").on("click", "a", function() {   $(this).next("ul.dropdown").toggle(); // show / hide corresponding sub-menu }); 

except after clicking on 1 link bring down dropdown, when click on top-level link bring down dropdown, first dropdown doesn't disappear. there way select other elements in .dropdown except 1 want , ask them hide themselves?

thanks in advance

$(".top-level").on("click", "a", function() {   var thedrop = $(this).next("ul.dropdown"); //convert dropdown in question var   thedropstate = thedrop.is(':visible'); //record current state of dropdown   $("ul.dropdown").hide(); //hide dropdowns   if(!thedropstate){ thedrop.show(); } //if state invisible, show dropdown }); 

this method stateless , set correct conditions every time. using toggle risk doing things $('ul.dropdown').toggle(); causing drop-downs show @ once.


Comments

Popular posts from this blog

java - Play! framework 2.0: How to display multiple image? -

gmail - Is there any documentation for read-only access to the Google Contacts API? -

php - Controller/JToolBar not working in Joomla 2.5 -