Hi Seb,
I think this is what you want:
$('.topMenu').click(function(){
$('ul.level1').filter( ":visible" ).slideUp('normal');
$(this).next().slideDown('normal');
return false;
});
Let me know and if not, I'll hack at it some more.
Rey
Seb Duggan wrote:
> I'm just starting up with jQuery, and have run into a problem with my
> navigation menu.
>
> It's a vertical accordion menu, with each section opening when clicked,
> and any other open sections close. Also, a section will close if it's
> open and clicked.
>
> So, I have the following code attached to the <a> elements in the menu:
>
>
> $('.topMenu').click(function(){
> $(this).next().addClass('active');
> $('ul.level1').filter(':visible').not('.active').slideUp('normal');
> $('.active').slideToggle('normal');
> $(this).next().removeClass('active');
> return false;
> });
>
>
> The HTML looks like this:
>
>
> <ul>
> <li><a href="link.htm" class="topMenu">Section 1</a>
> <ul class="level1">
> <li><a href="link.htm">Link 1</a></li>
> <li><a href="link.htm">Link 2</a></li>
> </ul>
> </li>
>
> <li><a href="link.htm" class="topMenu">Section 2</a>
> <ul class="level1">
> <li><a href="link.htm">Link 1</a></li>
> <li><a href="link.htm">Link 2</a></li>
> </ul>
> </li>
>
> <li><a href="link.htm" class="topMenu">Section 3</a>
> <ul class="level1">
> <li><a href="link.htm">Link 1</a></li>
> <li><a href="link.htm">Link 2</a></li>
> </ul>
> </li>
>
> </ul>
>
>
>
> This flags the clicked link; closes all the sections at the same level
> that are not the flagged link; toggles the clicked link; then removes
> the flag; and finally returns false so the browser doesn't follow the link.
>
> My problem is that, as the code stands, the closing and opening take
> place at the same time; I want the open sections to close, and then when
> that's finished the clicked section should toggle.
>
> I initially thought the callback feature would handle this; but after
> trying to work out why it didn't work, found that the rest of the script
> continues.
>
> I also thought chaining might be the answer, but couldn't get it to work
> as I wanted...
>
> How can I get the slideToggle to wait for the slideUp to complete?
>
>
> Seb
>
>
> ------------------------------------------------------------------------
>
> _______________________________________________
> jQuery mailing list
> [email protected]
> http://jquery.com/discuss/
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
