jQuery Accordion
- by Fuego DeBassi
Just wondering if anyone can provide some basic advice on an accordion I'm trying to simplify. Got a working version, but it seems way overly complex. Here is my new JS.
$(document).ready(function() {
$("#themes li ul").hide();
$("#themes li").hover(function() {
$("ul").show();
}, function() {
$("li ul").hide();
});
The markup looks like this:
<ul>
<li>Tier 1
<ul>
<li>Tier 2</li>
<li>Tier 2</li>
</ul>
</li>
<li>Tier 1
<ul>
<li>Tier 2</li>
<li>Tier 2</li>
</ul>
</li>
</ul>
My script works alright. But it shows all of the child ul's when any parent li is hovered, and it hides all the child ul's when unhovered. Just not sure how I can get it to A.) Only .show the li ul when that specific li is hovered. And B.) Hide the shown li ul only when another one is hovered (not itself). Example + explanation would be especially helpful! Thanks!!