[HTML et CSS] Images survolées

Résolu

Elerra Messages postés 62 Date d'inscription Statut Membre Dernière intervention -
Elerra Messages postés 62 Date d'inscription Statut Membre Dernière intervention - 13 juin 2010 à 12:36

Bonjour,
J'essaie de faire la page d'accueil de mon site, et de faire la barre de navigation.
J'ai commencer, mais j'ai mis des images survolées, sauf que quand je survole une des images avec la souris, l'image qui est censée apparaître, apparaît sur une autre image...Je ne sais pas si je suis très claire...

Voici le code de ma page :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>
       <title>Bienvenue sur mon site !</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   </head>
   <body><body bgcolor=#91fcff>
   <style type="text/css">
   body
{
background:  url('http://img691.imageshack.us/img691/3571/fond3i.png')  #91fcff no-repeat center top;
}
   </style>
   <!-- Le menu horizontal -->
               
           <!-- début script image 1 Accueil -->
<center>
<a href="LIEN1"><img id='img' src="Accueil.png" border=0
onmouseover="document.getElementById('img').src='Accueil2.png'"
onmouseout="document.getElementById('img').src='Accueil.png'"></a>

<!-- début script image 2 -->
<a href="LIEN2"><img id='img' src="urgences.png" border=0
onmouseover="document.getElementById('img').src='urgences2.png'"
onmouseout="document.getElementById('img').src='urgences.png'"></a>

<!-- début script image 3 -->
<a href="LIEN3"><img id='img' src="annonces.png" border=0
onmouseover="document.getElementById('img').src='annonces2.png'"
onmouseout="document.getElementById('img').src='annonces.png'"></a></center>
</body>
</html>

Merci a tous ceux qui m'aideront :)

Bonne journée

A voir également:

[HTML et CSS] Images survolées
Editeur html - Télécharger - HTML
Des images - Guide
Br html ✓ - Forum Webmastering
Images enregistrées ✓ - Forum Bluetooth
Voir ses images enregistrés - Forum Blender

3 réponses

Réponse 1 / 3

Siluni

Le principe d'un ID, c'est qu'il est unique.
La tu utilise 3 fois le meme ID "img" et donc PHP prend an conte que le dernier de tes ID => le 3eme

renomme img en img_1, img_2 et img_3 pour avoir un tout autre resultat

Réponse 2 / 3

louloute300 Messages postés 335 Date d'inscription Statut Membre Dernière intervention 29

Le script m'a l'air bon...
à un détail prêt:
Remplace peut être img par le name des balises de l'img que dans laquel tu souhaite voir apparaitre l'image...
sinon remplacer les onmouseover et onmouseout par, onmouseover="this.src='Accueil2.png'" onmouseout="this.src='Accueil.png'"

As tu vérifier l'adresse de tes images?

<img id='img' src="Accueil.png" border=0
onmouseover="document.getElementById('img').src='Accueil2.png'"
onmouseout="document.getElementById('img').src='Accueil.png'">

Réponse 3 / 3

Elerra Messages postés 62 Date d'inscription Statut Membre Dernière intervention 3

Merci beaucoup, ça fonctionne parfaitement ;-)

Discussions similaires

PIX

Votre réponse

Discussions similaires