I've got a menu that does the basic <a> links and shows a sub menu of
divs with nested <ul><li>'s and other text dynamically with css and
javascript. I'm migrating it over to jquery, and have it all working
perfectly except for one thing. I am trying to get the menu to jump
back to the tab that corresponds to the current page upon mouseout of
the menu's parent div.

My code is basically this:

<div id="menuholder">
        <div id="menu">
                <div id="toptabs">
                        <a..
                        <a..
                        <a..
                </div>
                <div id="tabcontentcontainer">
                        <div id="menustuff...
                        <div id="menustuff...
                        <div id="menustuff...
                </div>
        </div>
</div>

Each "toptabs a" is binded (bound?) with a mouseover to show a
corresponding menu div. All that works fine.

What I'm not getting though, and am completely stumped about, is
stopping the mouseout event from triggering on the child div's and a's
underneath the menu div. I've got it kind of working to stop all
children and self, and just do mouseout on the parent div, which would
be the menuholder div, but it doesn't fire all of the time, if at
all... it sometimes works if i mouse over the edge very slowly.

Here's my code... maybe someone can shed some light on either stopping
the child mouseover binding or triggering the mouseout on the parent
smoother.

(var currenttab is defined in the head by php)
<script>var currenttab = '$tabtitle';</script>


$(document).ready(function(){
        expandmenu(currenttab);

        $("#menu")
                .parent().mouseout(function(e){expandmenu(currenttab);})
                .children().andSelf().mouseout(function(e){return false;});

        $("#toptabs > a").each(function() {
                var rel = $(this).attr("rel");
                $(this).mouseover(function(){ expandmenu(rel); });
        });
});

function expandmenu(tabid){
        $("#toptabs:visible",function(){
                $("#toptabs > [EMAIL PROTECTED]'"+tabid
+"']").addClass("current").siblings("a.current").removeClass();
                $("#"+tabid).show().siblings("div:visible").hide();
        });
}

Reply via email to