Check what element the cursor is on upon mouseleave() with jQuery?

Question

I have a set of list elements (

within a

) laid out as bubbles on a chart like this, where the bubbles are the

Answer 1

If you can use ordinarey javascript, every event (e) mouse over and mouse out has an e.relatedTarget in most browsers. IE before #9 has event.toElement and event.fromElement, depending on if you are listening to a mouseover or mouseout.

somebody.onmouseout=function(e){
  if(!e && window.event)e=event;
  var goingto=e.relatedTarget|| event.toElement;
  //do something
}
somebody.onmouseover=function(e){
  if(!e && window.event)e=event;
  var comingfrom=e.relatedTarget|| e.fromElement;
  //do something
}

Answer 2

You need to use event.toElement || e.relatedTarget:

$('li').mouseleave(function(e)
{
    // new element is: e.toElement || e.relatedTarget
});

(Edited to note || e.relatedTarget to ensure browser compatibility)