Discussion :

[numerodix]

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 :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
 
<img src="map.png" id="imgMap" alt="Map" usemap="#map"/>
<img src="1.png" id="map1" alt="Map 1" usemap="#map1" class="sousMap" />
<img src="2.png" id="map2" alt="Map 2" usemap="#map2" class="sousMap" />
<img src="3.png" id="map3" 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 (id:imgMap) et afficher l'image avec l'id "map1", au clic sur la zone 2, il faut afficher l'image "map2", 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 :

S�lectionner tout - Visualiser dans une fen�tre � part

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 !

[SpaceFrog]

mets un css display none dans le callback du fade ?
ou modifies son z-index...
visibility ne supprime pas l'image du flux

[numerodix]

J'ai essay� de modifier le z-index sans succ�s...
Pareil pour display block.

Je viens de tester en supprimant la position "absolute" de mes images. Ainsi elles ne sont plsu superpos�es et on a un truc du style :
[image principale]
[sous-image1]
[sous-image2]
[sous-image3]

Sous firefox et sous IE , les images sont bien pr�sentes (les sous-images sont invisibles, normal).
Sous firefox, au clic sur la zone 1, l'image principale disparait et la sous-image1 devient visible. Tandis que sous IE, l'image principale disparait mais la sous-image1 reste invisible...

Edit : J'ai �galement essay� en utilisant opacity (filter:alpha(opacity=x)) � la place de visibility, et c'est la meme chose

[SpaceFrog]

j'ai r�pondu il y a un mois ou deux � un souci de map sur des images ...

[numerodix]

Mais � mon avis le probl�me ne vient pas des map, juste de l'image... Au pire, si �a venait de la map, l'image s'afficherait et les zones cliquables ne fonctionneraient pas, non ?
Et dans le pire des cas, tu penserais � une solution de remplacement ? J'avoue que je ne vois pas comment faire autrement...