how to correctly make a onmouseout event for a UL?

Question

Check this simple code:

<ul onmouseout='alert(1)'>
    <li>aaaaaaaaaaaaaaaaaaaaaaaa</li>
    <li>bbbbbbbbbbbbbbbbbbbbbbbbb</li>
    <li>ccccccccccccccccccccccccc</li>
</ul>

The onmouseout event is fired even when I am inside the UL traversing the LI with the mouse.

This is with FireFox, how can I make it right, so the event is fired when I really leave the UL?

Answer 1

You can use the jQUery mouseout, or the jQuery mouseleave functions for this, The same exists for Mootools.

EDIT

The mouse out event will be triggered whenever you leave one li and go to the next, but mouseleave is triggered only on leaving the whole of the div

$('#id').mouseleave(function(){
alert("left the div");  
});