Survol ne fonctionne qu'une seule fois sur IE
Bonjour,
Sur une image, je dois afficher au survol de certaines zones une bulle d'informations.
Voici le code HTML:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
| <img id="depmap" name="map" src="http://localhost/squelettes/dessin.php?d=34" alt="" title="" usemap="#carte_dep" />
<div id="id0" class="id-info" >
mon texte d'info
</div>
<div id="id1" class="id-info" >
mon texte d'info 1
</div>
....
<map id="cartelr_dep" name="carte_dep">
<area class="info" shape="circle" coords="585,389,8" onmouseover="show('id0',585,389);" onmouseout="hide('id0');" href="/carte.php?v=id0" alt="" />
<area class="info" shape="circle" coords="732,257,8" onmouseover="show('id1',732,257);" onmouseout="hide('id1');" href="/carte.php?v=id1" alt="" />
...
</map> |
et maintenant le JavaScript (inclus dans le head) :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
| <script type="text/javascript">
function show(arg,x,y) {
var map=document.getElementById('depmap');
document.getElementById(arg).style.left = document.getElementById(arg).style.left + map.style.left + x + 'px';
document.getElementById(arg).style.top = map.style.top+ y + 'px';
document.getElementById(arg).style.visibility = 'visible';
}
function hide(arg) {
document.getElementById(arg).style.visibility = 'hidden';
}
// -->
</script>
</head> |
Avec FF, Safari etc, cela fonctionne au poil, par contre, avec IE (7 & 8, je suppose aussi le 6) lorsque survol pour la première fois, cela fonctionne au poil. Par contre, au second survol, le cadre css ne s'affiche pas.
PS : Si vous avez une meilleure méthode pour les survols, je suis preneur ;)
