Bonjour,

Je suis tomb� sur un bug surprenant concernant la gestion des �v�nements
sur Internet Explorer 7 et 8

Et j'aimerai bien savoir si quelqu'un a une explication rationnelle :-)

Je pose un overlay qui occupe toute la page en position fixed
top: 0; left: 0; bottom: 0; right: 0;

Je g�re le onclick dessus et aussi sur certains �l�ments de ma page.

Sur tous les navigateurs except� IE le overlay en position fixed g�re
le click et les autres �l�ments ne le voie pas.

Sur IE, c'est le onclick de la div #dessous qui est trait�, mais uniquement
quand on click sur le texte (alors qu'on pourrait s'attendre � une gestion du
click sur toute la div)

Partout ailleur sur la page, c'est bien le onclick de l'overlay qui est trait�.

Ce n'est pas une question de remont�e des �v�nement (bubbling) puisque
l'overlay n'est pas enfant du div #dessous (�a change rien au probl�me de
tenter de faire un preventDefault ou stopPropagation ou return false sur le
gestionnaire d'�v�nement)

Voici un code pour tester. Vous pouvez contourner le bug en appliquant
une couleur de fond et une transparence (marche aussi avec une image
de fond transparente). Pour cela d�commentez dans le css.

Code : S�lectionner tout - Visualiser dans une fen�tre � part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<div xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
#dessous { background-color: #ff0; }
#overlay { 
  position: fixed; top: 0; left: 0; bottom: 0; right: 0;
  /* background: #000; opacity: 0; filter: alpha(opacity = 0); */
}
</style>
</head>
<body>
<div id='dessous' onclick='alert("dessous")'>Dessous</div>
<div id='overlay' onclick='alert("overlay")'></div>
</body> 
</html>