Afficher une image lors d'un survol
Antoine
-
bbar Messages postés 436 Statut Membre -
bbar Messages postés 436 Statut Membre -
Bonjour,
J'aimerais afficher une petite image 1 sur une image 2 ( l'image 2 occupe toute la place de la page, tandis que l'image 1 ne fait que quelques px sur quelques px)
En fait, l'image 2 est mappée en html (il s'agit en fait d'une carte géographique), avec plusieurs endroits dessus ou on peut cliquer. Il faudrait donc, quand on clique sur les area, qu'une petite image s'affiche...
En gros, il faut remplacer le title="" d'un lien par une image...
J'espere avoir été assez clair!
Merci d'avance pour votre aide,
Antoine
J'aimerais afficher une petite image 1 sur une image 2 ( l'image 2 occupe toute la place de la page, tandis que l'image 1 ne fait que quelques px sur quelques px)
En fait, l'image 2 est mappée en html (il s'agit en fait d'une carte géographique), avec plusieurs endroits dessus ou on peut cliquer. Il faudrait donc, quand on clique sur les area, qu'une petite image s'affiche...
En gros, il faut remplacer le title="" d'un lien par une image...
J'espere avoir été assez clair!
Merci d'avance pour votre aide,
Antoine
A voir également:
- Afficher une image lors d'un survol
- Légender une image - Guide
- Image iso - Guide
- Reduire taille image - Guide
- Agrandir une image - Guide
- Detourer une image - Guide
1 réponse
salut,
il va falloir dans un premier temps définir l'emplacement de tes images dans ta carte : le plus simple à ce niveau là est de mettre chaque image dans un div auquel tu vas donner une id avec un z-index supérieur à celui de ta carte pour qu'elles soient au dessus. Il faut que tu leur donnes également la position
Ensuite, il faut que ces images soient cachées par défaut (dans le div : syle="display:none")
Enfin, dans ta balise area, tu vas avoir besoin des options onmouseover et onmouseout :
- onmouseover : tu affiches l'image (style.display="block")
- onmouseout : tu chaches l'image (style.display="none")
à chaque fois, tu envoies l'id de la photo que tu veux afficher (cacher) et tu t'en sert pour lui appliquer le nouveau style display (block ou none).
Vois déjà avec ça.
Si tu galère trop, j'essayerai de te pondre un petit exemple
Bon courage
B@bar
il va falloir dans un premier temps définir l'emplacement de tes images dans ta carte : le plus simple à ce niveau là est de mettre chaque image dans un div auquel tu vas donner une id avec un z-index supérieur à celui de ta carte pour qu'elles soient au dessus. Il faut que tu leur donnes également la position
Ensuite, il faut que ces images soient cachées par défaut (dans le div : syle="display:none")
Enfin, dans ta balise area, tu vas avoir besoin des options onmouseover et onmouseout :
- onmouseover : tu affiches l'image (style.display="block")
- onmouseout : tu chaches l'image (style.display="none")
à chaque fois, tu envoies l'id de la photo que tu veux afficher (cacher) et tu t'en sert pour lui appliquer le nouveau style display (block ou none).
Vois déjà avec ça.
Si tu galère trop, j'essayerai de te pondre un petit exemple
Bon courage
B@bar
