Page 1 sur 1

OnMouseOver sur zone réactive de type "area shape"

Posté : 18 mars 2007, 12:33
par Ouam34
Bonjour,
Derrière ce "Sujet" au nom barbare se cache un problème auquel je n'ai pas trouvé de solution... je compte donc sur vous ! :)

Je m'explique : J'ai une grande image (Image1 950x200px) et je voudrais qu'au survol d'une partie de cette image (définie avec area shape="poly" coords="407,86,...) et seulement une partie de cette image, Image1 soit remplacée par une autre image ayant les mêmes dimensions (Image2 950x200px)... et accessoirement que cette zone réactive de survol mène vers une autre page web si on clique dessus. Retour à Image1 lorsqu'on ne survole plus la zone réactive.

Voilà, le principe n'est pas compliqué sauf que je n'y arrive pas... :( Certes, je ne suis pas doué mais j'ai parcouru beaucoup de sites web qui expliquent comment utiliser la fonction "OnMouseOver" et "onMouseOut" avec la balise <IMG> ou par l'emploi d'un code javascript, j'ai aussi essayé d'intégrer tout ça dans un tableau, en passant pas une image de background... sans succès... il ne me reste plus qu'a faire une animation flash si je ne trouve pas la solution.

Si quelqu'un a une idée pour résoudre mon casse-tête, ce serait bien gentil ! Je n'ai aucune préférence quant à la méthode employée du moment que ça fonctionne !! (si je pouvais éviter l'anim' flash quand même...)

D'avance, Merci !

Ouam34

Posté : 18 mars 2007, 13:33
par Ryle
Jette un coup d'oeil ici : http://mikecherim.com/experiments/css_map_pop.php
je pense que c'est ce genre de chose que tu recherches :)

Posté : 18 mars 2007, 15:13
par Ouam34
Effectivement c'est ce type d'effet que je souhaite obtenir. Je regarde ça en détail et je répondrai bientôt.

Merci beaucoup ! :D

Posté : 20 mars 2007, 23:26
par Ouam34
Ca y est ! !

Fioouuu.... ! j'ai mis le temps mais j'ai réussi ! 8-)
Merci à toi de m'avoir mis sur la voie ! Le lien que tu m'avais indiqué m'a bien aidé mais m'a aussi posé pas mal de problèmes, en particulier avec les retraits négatifs. De plus, le débutant que je suis a eu du mal à décortiquer le code sans explication... :oops:
Mais le résultat obtenu par MikeCherim.com m'a tellement donné envie que j'ai un peu farfouillé sur le net et je suis finalement tombé sur --> cet article de Pompage.net <-- qui est vraiment génial.
J'en conseille vivement sa lecture à tout débutant comme moi qui veut atteindre ce genre de rendu. (Il peut être utile de "voir le code source" des pages où l'auteur présente ses exemples ! :wink: )

Merci encore !