Question

please can you help a jquery beginner out? I don’t really know how to go ahead…

I did a jquery animated menu: look at this. the content loads with ajax, so there’s not really a page load.

now i have to do the active item part. to give a clicked item a class “on”, I did this:

$navig.click(function() {
    $(this).addClass("on");
    $navig.not(this).removeClass("on");
})

the item with class “on” has to:

• animate to active state (similar to the mouseover state), and keep this
• other items has to animate back to the normal state (when class “on” is removed)
• if you click on a sub item, the parent item has to animate to active state

any ideas how to solve it?

Answer 1

You could make use of the `:animated’ selector

$navig.click(function() {
    // turn on current item and animate to blablabla
    $(this).addClass("on").animate({blablabla});
    // turn off others and animate back
    $navig.not(this).removeClass("on").filter(':animated').stop().animate({blablabla});
});