Images superposées : bug IE7
Bonjour à tous,
J'aurais besoin d'un coup de main pour un problème de javascript...
J'ai plusieurs images superposées les unes sur les autres :
Code:
1
2
3
4
5
|
<img src="map.png" id="imgMap" alt="Map" usemap="#map"/>
<img src="1.png" id="1" alt="Map 1" usemap="#map1" class="sousMap" />
<img src="2.png" id="2" alt="Map 2" usemap="#map2" class="sousMap" />
<img src="3.png" id="3" alt="Map 3" usemap="#map3" class="sousMap" /> |
La première image à la propriété visibility:visible, et les autres hidden. Il s'agit d'images cliquable. Ainsi au clic sur la zone 1, je cherche à cacher la première image et afficher l'image 1, au clic sur la zone 2, il faut afficher l'image 2, etc...
Tout fonctionne très bien sur Firefox, mais sous IE7, les "sous-images" ne s'affichent pas. L'événement "click" est bien executé, l'image "map.png" est bien cachée mais l'autre image ne s'affiche pas.
Voici mon code JS (Mootools) :
Code:
1
2
3
4
5
6
7
8
9
|
$$('#imgMap area').addEvents({
'click':function(){
$('imgMap').fade("hide");
var map = 'map'+this.get("id");
$(map).fade("show");
return false;
}
}); |
J'ai tout essayé, utiliser $(map).setStyle('visibility','visible') à la place de fade("show"), utiliser display : none/block à la place de visibility, mettre les images dans des div et cacher/afficher les div... Ça fonctionne toujours sous Firefox, mais jamais sous IE...
Merci d'avance pour votre aide !
