mouseleave event does not work in absolute child element

Question

I have menu list like

<ul class="systeMenus">
    <li>
        <ul>
            <li></li>
            <li></li>
            <li></li>
        </ul>
    </li>
    <li></li>
</ul>

The first ul tag is opening from some other onmouseover event of the link in another frameset frame.

The 2 ul opens by CSS display:block;position:absolute; left:175px; to parent li just like one menu appears inside parent li tag and hides at onmouseout event on the same tag li.

How can I hide these both the ULs when mouseenter on body. As I tried $('body').mouseenter and parent $('ul.systeMenus').mouseleave. Since I am getting problem on both of the implementation.

Any help is appreciated.Kindly provide the solution.

Can you post a [fiddle](http://jsfiddle.net) showing what the problem is? — no.good.at.coding, Apr 17 '11 at 19:57
I'm guessing this is happening in IE... I've just come across the same thing - because the element is AP the mouseleave event is triggered when you hover over padding, margin or border space? That's happening in my case - I think it's because the AP element is not considered to be inside its parent in IE? — danjah, Sep 19 '11 at 05:16

score 1 · Answer 1 · answered Oct 29 '11 at 16:45

Try using the hover in jquery

Something like that :

$("ul").hover(function(){ //triggered on mouseEnter}, function(){ //triggered on MouseLeave});

I've got a problem in IE one time with mouseEnter and mouseLeave, the hover fixed it.

If it's not working post a fiddle. But by now maybe you have fixed your problem.

mouseleave event does not work in absolute child element

1 Answers1