Hit a snag with simple accordion menu
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. The initial "hide" and "slideToggle" function 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</a></li>
<li><a href="#">second level link #1</a></li>
<li><a href="#">second level link #1</a></li>
<li><a href="#">second level link #1</a></li>
</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');
- });
- });
- </script>
Any help would be GREATLY appreciated!
Thanks!
Matt