Problema con mousemove in Internet Explorer

Question

Internet Explorer non genera eventi onmousemove quando il target dell'evento è posizionato su un elemento <img> e non ha uno sfondo.

Ma registra l'evento quando il target ha uno sfondo. Qualcuno ha una spiegazione per questo? Ho avuto lo stesso comportamento in IE10, IE9 e IE8.

Fiddle qui: http://jsfiddle.net/xSpqE/2/

Answer 1

Ancora un altro IE falliscono! Questo è più di una soluzione di una risposta, ma sembra funzionare bene:

var is_ie = $.browser.msie; 
if(is_ie){ 
    $('.main img').mousemove(function(e){ 
     $('.pageX').text('pageX: '+e.pageX); 
    } 
} 

Questo è in aggiunta alla funzione di $('.overlay').mousemove, in modo da tenere anche, e naturalmente il controllo is_ie è opzionale.

Answer 2

come chiesto OP per un motivo, ecco la mia svolta:

E 'più facile da spiegare visivamente, quindi in primo luogo fuori aggiungiamo un gestore di clic per i img s:

$('img').click(function() { 
    $('.pageX').text('img clicked!'); 
}); 

Fiddle

Giusto. Fai clic sull'immagine nei browser Chrome/Firefox/not-IE e non accadrà nulla poiché lo è lo div in posizione assoluta.

Ora provalo su IE. Il gestore dei clic di img viene attivato! Pertanto mostra che IE spinge gli elementi attraverso elementi "trasparenti" (senza contenuto o sfondo) assolutamente posizionati. Più interessante, gli elementi relativamente posizionati subiscono lo stesso problema e l'impostazione di z-index su entrambi gli elementi non lo risolverà. Ovviamente, poiché l'immagine è sopra l'overlay, non attiverà l'evento mousemove dell'overlay.

Una soluzione alternativa consiste nel fornire un po 'di "riempimento" alla sovrapposizione, ad esempio background:rgba(0,0,0,0) imporrà a IE di mantenere l'elemento posizionato in modo assoluto nella parte superiore. Fiddle. Se hai bisogno di supportare i browser senza il supporto di rgba, usa una gif trasparente 1x1px come sfondo.

Non ho mai visto questo definito in nessuna specifica o ufficialmente segnalato come un bug. Non c'è alcuna logica o ragione per gli elementi posizionati in modo assoluto senza il contenuto o lo sfondo di subire questo problema di z-index, quindi lo chiamerò ancora un altro bug di IE. Forse segnalarlo sul Microsoft forums sarebbe utile.

Inoltre, relativa domanda: IE bug: absolutely-positioned element with a non-transparent background colour