annulation événement mouseout lorsque l'élément est recouvert

Question

Espérons que cette jsFiddle devrait illustrer la question mieux que mes paroles:

http://jsfiddle.net/pmwRc/6/

J'affichons un H4 absolument positionné comme une étiquette sur une carte d'image lorsque la carte est plané. Cependant, lorsque le pointeur de la souris est déplacé sur le H4, la carte d'image déclenche un "mouseout", ce qui provoque la dissimulation du H4.

Comment puis-je empêcher cela? Je veux que l'étiquette soit visible lorsque la souris est au-dessus de la carte-image, qu'elle soit aussi sur l'étiquette.

Answer 1

Vous pourriez «tricher» en utilisant une image/couche transparente (en utilisant votre carte) qui est placée au-dessus de votre image.

http://jsfiddle.net/GRPQa/7/

Il fonctionne en utilisant la carte coordonnées de l'image.

Answer 2

function doSomething(e) { 
    if (!e) var e = window.event; 
    var tg = (window.event) ? e.srcElement : e.target; 
    if (tg.nodeName != 'DIV') return; 
    var reltg = (e.relatedTarget) ? e.relatedTarget : e.toElement; 
    while (reltg != tg && reltg.nodeName != 'BODY') 
     reltg= reltg.parentNode 
    if (reltg== tg) return; 
    // Mouseout took place when mouse actually left layer 
    // Handle event 
} 

Voir http://www.quirksmode.org/js/events_mouse.html

Answer 3

Je sais qu'il est pas exactement la même chose, mais j'ai modifié votre violon et a obtenu une alternative de travail, juste sans la carte d'image;) (vol stationnaire au milieu de « G » et premier 'o')

http://jsfiddle.net/pmwRc/31/

Vous pouvez utiliser l'attribut de style pour définir les coordonnées dans le balisage pur si nécessaire:

http://jsfiddle.net/pmwRc/33/