Controlla quale elemento il cursore è su mouseleave() con jQuery?

Question

Ho una serie di elementi della lista (<li> entro un <ul>) disposti come bolle su un grafico come questo, dove le bolle sono gli <li> elementi:

http://i.stack.imgur.com/PR7vR.png

voglio essere in grado di rilevare il differenza tra

1. Spostando il mouse dalla bolla # 1 alla rete
2. Spostando il mouse dalla bolla # 1 direttamente ad un bolla nother, come ad esempio la bolla 2

ho tentato di utilizzare $(this) nel .mouseleave() anche per una bolla, ma registra l'elemento che si sta lasciando, piuttosto che l'elemento che si sta in bilico.

Qualche idea su come ottenere l'elemento su cui si sta muovendo il mouse su mouseleave()?

Answer 1

è necessario utilizzare event.toElement || e.relatedTarget:

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

(A cura di notare || e.relatedTarget per garantire la compatibilità del browser)

Answer 2

Se è possibile utilizzare ordinarey javascript, ogni evento (e) mouse sopra e mouse fuori ha un target e.related nella maggior parte dei browser. IE prima del n. 9 ha event.toElement e event.fromElement, a seconda che si stia ascoltando un mouseover o un 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 
}