onmouseout behavior in js and html

Question

<a href="/somewhere" onmouseout="someFunction()">blah blah blah<img src="blah.jpg"></a>

In the above link, I have someFunction() firing when the mouse leaves the link. Seems straight forward. But when I hover over the image 'blah.jpg' the onmouseout event also fires. This is not desirable because 'blah.jpg' is in fact in the a node. The same thing happens if i have a div inside the a node, or any other html element other than straight text: javascript considers this to be out of the a node. Is there a way to stop these events from improperly firing? The described behavior is in chrome and ff on win7.

*update: if there is a jquery solution, do tell

Answer 1

Similar in concept to shehzad, so I voted him up. Should work cross-browser. in html:

onmouseout='out(this)'

in js (with included jquery file):

out(thisRef) {
   var newHover = event.relatedTarget || event.toElement;
   if(!jQuery.contains(thisRef,newHover) && !(thisRef==newHover)) {
        someFunction();
   }

}