Image lien et effet survolée en même temps

ambreambre Messages postés 19 Statut Membre -  
ambreambre Messages postés 19 Statut Membre -
Bonjour,

Je ne sais pas écrire du Javascript, du coup, je récupère des bouts de codes pour les personnaliser autant que faire ce peut.
(mais là j'ai récupéré un bout de code et cela ne fonctionne pas je ne sais pas pourquoi :/ )

Je cherche le code javascript pour faire d'une image un lien vers une page, mais avec un effet de survol dessus en même temps !
(Je crois qu'on trouve A HREF et onMouseOver et onMouseOut dedans ...)
(En fait, mon image c'est un bouton de mon menu qui me mène vers une autre page de mon site. Elle représente un dessin gris, et quand la souris passe dessus je veux que ce soit une autre image qui apparaisse avec le dessin qui est en noir ;-) , et puis quand je clic dessus j'arrive sur le menu en question.)

Fastoche vous allez me dire ! C'est un truc hyper courant, mais pourtant impossible de mettre la main là dessus !!!
(Peut-être que je n'utilise pas les bons mots clefs quand je cherche..)

Si vous pouviez m'aider en me donnant ce code ou en me disant ou je peux trouver ça ;-)

Grand merci d'avance'

PS :
Ce que j'avais trouvé c'était ça, mais ça marche pas :(

<head>
<!-- DEBUT DU SCRIPT -->
<SCRIPT LANGUAGE="JavaScript">
/* PRECHARGEMENT DE L IMAGE DANS LE CACHE DU NAVIGATEUR */
if(document.images)
{
i854784 = new Image;
i854784 = "images/chap_legraph.jpg";
<!-- MON IMAGE DE REMPLACEMENT -->
}
</SCRIPT>
<!-- FIN DU SCRIPT -->
</head>

<!-- DEBUT DU SCRIPT -->
<A HREF="/WWWGRAPH./index.php" <!-- MA PAGE DE DESTINATION AU CLIC DE LA SOURIS -->
onMouseOver="i854784.src='images/chap_legraph.jpg'" <!-- MON IMAGE DE REMPLACEMENT -->
onMouseOut="i854784.src='images/chap_legraph_gris.jpg'"> <!-- MON IMAGE 1 DE BASE -->
<IMG SRC="images/chap_legraph_gris.jpg" BORDER=0 NAME="i854784" ALT="menu LE GRAPHIQUE" HSPACE=0 VSPACE=0>
</A>
<!-- FIN DU SCRIPT -->

A voir également:

2 réponses

Matt
 
Bonjour,
Le code que t'as récupéré me parait crédible à condition que tu crées les deux image : la normal et celle en réponse à l'évènement de passage de la souris, si ça ne marche pas merci de donner le lien de la page Web que tu as essayé de faire et on débugera
A bientôt
1
ambreambre Messages postés 19 Statut Membre 5
 
Bin, j'ai bien créé les deux images. Bizarrement elles ne s'affichent pas :/ pourtant j'ai vérifié plusieurs fois les noms, les chemins, les dossiers.. bref' j'arrive pas à comprendre grrrr !
Bon je vais le mettre en ligne ce week-end et te donner l'adresse dès que c'est fait ;-) merci
0
ambreambre Messages postés 19 Statut Membre 5
 
Alors c'est l'incompréhension totale parce que maintenant ça marche !!!

Cela faisait plusieurs jours que cela ne fonctionnait plus, même mes includes en php ne fonctionnaient plus ! et là tout est ok. Et je bosse en local donc cela ne peux même pas être une histoire de serveur problématique chez un hébergeur..
ça me rends dingue !!! ... o_0 ... !!!
Bon, je croise les doigts pour que ça dur ;-)

Merci pour votre aide !
0
adns Messages postés 1152 Statut Membre 153
 
Salut,

le script me parait aussi correct mais assez compliqué si tu ni connais vraiment rien..

je te propose une solution alternative plus simple a mon gout :p


<img src="images/imageDeBase.png" onmouseover="this.src='images/imageSurvole.png';" onmouseout="this.src='images/imageDeBase.png';" >



Explication :

this est l'élément courant
donc this.src la source de l'image
onmouseover (quand la souris survole l'élément)
onmouseover(quand on ne survole plus l'élément)

En esprérant avoir aidé :p

Adns
0
ambreambre Messages postés 19 Statut Membre 5
 
Ok, mais dans ce code que tu me donnes je ne vois pas le lien vers une page ???

Car je voudrais un effet de survol sur mon image ET un lien vers une page quand je clic dessus.
0
jeangilles Messages postés 816 Date d'inscription   Statut Membre Dernière intervention   186
 
Oui, il manque un onclick
Un truc comme ceci devrait marcher :

<img src="images/imageDeBase.png" onmouseover="this.src='images/imageSurvole.png';" onmouseout="this.src='images/imageDeBase.png';" onclick="window.location = 'mettre_ici_l_url' ;" >
0
ambreambre Messages postés 19 Statut Membre 5
 
comme je le disais dans un commentaire plus haut à Matt, finalement mon code fonctionne ^^
comprends pas ce qui c'est passé, (???) suis désolée :/

mais je vais tester quand même celui-ci juste pour voir !!!
merci beaucoup pour ton aide ;-)
0