Problème RollOver

fab0 Messages postés 35 Statut Membre -
rachidrachid - 21 mai 2008 à 12:12

Bonsoir tout le monde

J'ai un problème vraiment étrange avec les rollOvers. Je n'arrive pas à faire changer les boutons au passage de ma souris, pourtant ce code fonctionne à merveille sur un autre site que j'avais fait.
Je vous laisse le code ici :

<head>
<!-- DEBUT DU SCRIPT -->
<SCRIPT LANGUAGE="JavaScript">

if(document.images)
{
bouton_1 = new Image;
bouton_2 = new Image;
bouton_3 = new Image;
bouton_4 = new Image;
bouton_5 = new Image;
bouton_1 = "images/img_structure/menu/b_animaux_hover.jpg";
bouton_2 = "images/img_structure/menu/b_coucheSoleil_hover.jpg";
bouton_3 = "images/img_structure/menu/b_creation_hover.jpg";
bouton_4 = "images/img_structure/menu/b_monument_hover.jpg";
bouton_5 = "images/img_structure/menu/b_sports_hover.jpg";
}
</SCRIPT>
<!-- FIN DU SCRIPT -->
</head>

et maintenant entre mes balises BODY :

<table width="170" border="2" cellspacing="0" cellpadding="0">
  							<tr><!-- <A HREF="consulter_actions_a/consulter_nos_actions.htm" target="_self" onMouseOver="bouton_1.src='bouton_menu/bouton_hover_1.gif'"  onMouseOut="bouton_1.src='bouton_menu/bouton_1.gif'"><IMG SRC="bouton_menu/bouton_1.gif" ALT="consulter_nos_actions" NAME="bouton_1" width="200" height="80" HSPACE=0 VSPACE=0 BORDER=0></A> -->
    							<td><a href="pages/animaux.php" target="_parent" onMouseOver="bouton_1.src='images/img_structure/menu/b_animaux_hover.jpg' " onMouseOut="bouton_1.src='images/img_structure/menu/b_animaux.jpg' "><img src="images/img_structure/menu/b_animaux.jpg" alt="animaux"></a></td>
 							</tr>
							
  							<tr>
    							<td><a href="pages/soleil.php" target="_parent" onMouseOver="bouton_2.src='images/img_structure/menu/b_coucheSoleil_hover.jpg' " onMouseOut="bouton_2.src='images/img_structure/menu/b_coucheSoleil.jpg' "><img src="images/img_structure/menu/b_coucheSoleil.jpg" alt="couche de soleil"></a></td>
  							</tr>
  							<tr>
   								 <td><a href="pages/creations.php" target="_parent" onMouseOver="bouton_3.src='images/img_structure/menu/b_creation_hover.jpg' " onMouseOut="bouton_3.src='images/img_structure/menu/b_creation.jpg' "><img src="images/img_structure/menu/b_creation.jpg" alt="creations"></a></td>
 							</tr>
  							<tr>
    							<td><a href="pages/monuments.php" target="_parent" onMouseOver="bouton_4.src='images/img_structure/menu/b_monument_hover.jpg' " onMouseOut="bouton_4.src='images/img_structure/menu/b_monument.jpg' "><img src="images/img_structure/menu/b_monument.jpg" alt="monuments"></a></td>
  							</tr>
  							<tr>
   	 							<td><a href="pages/sports.php" target="_parent" onMouseOver="bouton_5.src='images/img_structure/menu/b_sports_hover.jpg' " onMouseOut="bouton_5.src='images/img_structure/menu/b_sports.jpg' "><img src="images/img_structure/menu/b_sports.jpg" alt="sports"></a></td>
  							</tr>
					</table>
																<!-- Fin Tabelau Menu -->

Je remercie d'avance les personnes qui trouveront la solution, moi cela fait deux heures que je suis dessus est toujours rien.( les liens sont bons).

Afficher la suite

2 réponses

Réponse 1 / 2
Squalou Messages postés 29 Statut Membre 3

Bonjour,

Il y a plusieurs petits point à revoir dans ton code,

D'abord il est préférable d'importer ton script dans la page, donc de créer un fichier menu.js par exemple. Je vais te faire un exemple pour le bouton_1

Ton fichier menu.js dans lequel tu indiques ton image de base, ton image hover ainsi que le bouton (il faut lui donner le nom de l'image sur laquelle on va mettre les liens) :

if(document.images) {
bouton_1 = new Image;
bouton_1_hover = new Image;
bouton_1.src = "images/img_structure/menu/b_animaux.jpg";
bouton_1_hover.src = "images/img_structure/menu/b_animaux_hover.jpg";

}
else {
document.bouton1 = ""
}

Ensuite entre les balises <head> tu appelles ton script :

<script type='text/javascript' src='menu.js'></script>

Et les liens pour le bouton :

<a href="pages/animaux.php" target="_parent" onMouseOver="document.bouton1.src=bouton_1_hover.src" onMouseOut="document.bouton1.src=bouton_1.src"><img src="images/img_structure/menu/b_animaux.jpg" alt="animaux" width="1280" height="960" border="0" name="bouton1"></a>

Ne pas oublié de nommer ton image comme le bouton.
Et ainsi de suite pour tous tes boutons...

Normalement ça devrait marcher un peu mieux :-)

@+
0
1. fab0 Messages postés 35 Statut Membre
  
  Merci Squalou c'est bon, désolé pour le temp que j'ai mis à te répondre.Je suis un peu occupé ces derniers temps ; ).
  
  0
Réponse 2 / 2
rachidrachid

bonjour a tous
j en ai marre d reflichir a ce script mais ca marche pas
si vous pouvez me priciser l faute svp
merci a tous
<?php
$res=mysql_fetch_row($o);
echo"
<script language=javascript>
image1 = new Image
image1.src = photo_produits/$res[2]
image2 = new Image
image2.src = photo_produits/$res[8]
image3=new Image
image3.src=photo_produits/$res[9]
image4=new Image
image4.src=photo_produits/$res[10]
</script>
<table><tr><td>
<a href=# onMouseOver=distance.src=image1.src >
<img src=photo_produits/$res[2] >
</a>
<a href=# onMouseOver=distance.src=image2.src >
<img src=photo_produits/$res[8]>
</a>
<a href=# onMouseOver=distance.src=image3.src >
<img src=photo_produits/$res[9]>
</a>
<a href=# onMouseOver=distance.src=image4.src >
<img src=photo_produits/$res[10]>
</a></td></tr>
<br>
<br><tr><td>
<img src=photo_produits//banane.gif border=0 width=63 height=29 name=distance alt=ALL HTML>
</td></tr>";
echo"<tr>
<td>Nom : $res[0]<br> Description :$res[7] <br>Prix : $res[1] DH</td>
</tr></table>";
?>
0

Problème RollOver

2 réponses

Discussions similaires

Newsletters