Div Onmouseout Not As Expected

Text and sample code adapted from http://www.webdeveloper.com/forum/archive/index.php/t-65078.html, may not reflect actual question: I have a div and then a div with a nested tabl

Solution 1:

onmouseleave is the thing that worked for me.

Solution 2:

i suggest you to read this article on 3 phases of javascript events. http://www.quirksmode.org/js/events_order.html

in the function move or out, you can check if the srcElement(IE) or target(W3C) has an id called dvRep..

it should look something like this:

function out(event)
{
   event.stopPropagation(); //cancel bubbling

   ele = event.target || event.srcElement
   if (ele.id === "dvRep"){  
      //your code
   }
}

Solution 3:

It sounds like you're having issue with event bubbling.

When you hover a tr you're mouse is no longer 'in' the div - therefore when you move between them you're going tr (out) -> div (in) -> div (out) -> tr (in). That's why you're out() function is being called between tr's.

Useful reading:

• http://www.quirksmode.org/js/events_order.html
• http://en.wikipedia.org/wiki/DOM_Events#Common.2FW3C_events