Slidetoggle multiple divs?
I'm having no problem with a single slideToggle div, but I need to have two or three on a single page, with each opening in the same place. So I basically need each click to check whether one of the other slide divs are open, and close (or hide) it, then slide the clicked on open.
Here is the code I have for the single div:
-
$(document).ready(function() {
$('#showThis').live('click', function() {
$("div#showThisPanel").slideToggle("slow");
});
});
My html I want to use for multiple panels:
-
<div id="showThisPanel">
<div id="Panel1">
<ul>
<li><a href="#">text</a></li>
<li><a href="#">text</a></li>
<li><a href="#">text</a></li>
</ul>
</div>
<div id="Panel2">
<ul>
<li><a href="#">text</a></li>
<li><a href="#">text</a></li>
<li><a href="#">text</a></li>
</ul>
</div>
<div id="Panel3">
<ul>
<li><a href="#">text</a></li>
<li><a href="#">text</a></li>
<li><a href="#">text</a></li>
</ul>
</div>
</div>
Any ideas on how to accomplish this?