mmc215
09-08-2010, 09:51 PM
Hit a snag here, I've put together a rather simple accordion menu but am having trouble getting the visible menus to "slideUp" when another sibling <li> is selected (aka, do the accordion thing). The initial "hide" and "slideToggle" function to make them go up and down works just fine.
I'm using this format for the menu:
<div class="accordion">
<ul>
<li><a href=#">NAV LINK #1</a>
<ul>
<li><a href=#">second level link #1</li></a>
<li><a href=#">second level link #1</li></a>
<li><a href=#">second level link #1</li></a>
<li><a href=#">second level link #1</li></a>
</ul>
</li>
<li>NAV LINK #2...
<script type="text/javascript">
$(document).ready(function() {
$('div.accordion> ul ul').hide();
$('div.accordion> ul li a').click(function() {
$(this).next('ul').slideToggle('fast')
.siblings('ul:visible').slideUp('fast'); //THIS IS WHERE I'M STUCK
});
});
</script>
Any help would be GREATLY appreciated!
Thanks!
Matt
I'm using this format for the menu:
<div class="accordion">
<ul>
<li><a href=#">NAV LINK #1</a>
<ul>
<li><a href=#">second level link #1</li></a>
<li><a href=#">second level link #1</li></a>
<li><a href=#">second level link #1</li></a>
<li><a href=#">second level link #1</li></a>
</ul>
</li>
<li>NAV LINK #2...
<script type="text/javascript">
$(document).ready(function() {
$('div.accordion> ul ul').hide();
$('div.accordion> ul li a').click(function() {
$(this).next('ul').slideToggle('fast')
.siblings('ul:visible').slideUp('fast'); //THIS IS WHERE I'M STUCK
});
});
</script>
Any help would be GREATLY appreciated!
Thanks!
Matt