Code Rollover

Bonsoir, j’aimerais sur mon site que quand on passe la souris sur le lien une image apparaisse et quand on quitte ce lien l’image disparaisse.

Je voudrais rester sur la même page avec tous les liens articles et qu’il y’ait tune petite fenêtre qui pop

Voici mon code pour l’instant :

test

D’avance merci de votre aide

Salut !

Ton code ne peut pas fonctionner. Tu crées une nouvelle image mais JS ne sait pas laquelle… Il faut que tu lui spécifies quelle image le src doit changer.

Voici un code que je n’ai pas testé mais qui devrait fonctionner.


<HTML>
      <HEAD>
            <SCRIPT LANGUAGE="Javascript">
                  <!--
                  // on récupère l'élément dom de la page html via son attribut id
                  monrollover= document.getElementById('monrollover'); 
                  monrollover.src="image-subsitution.gif";
                  //-->
            </SCRIPT>
      </HEAD>
      <BODY>
            <A HREF="votre-lien.html" onmouseover="monrollover.src='desert.jpg';" onmouseout="monrollover.src='';">
                  <IMG SRC ="" name="monrollover" border=0 id="monrollover">
                  test
            </A>
      </BODY>
</HTML>

PS : évite les majuscules dans tes balises et attributs, c’est recommandé dans le W3C :wink:
Edité le 15/11/2010 à 13:32

Ceci étant, cela ne peut pas fonctionner… Les scripts sont chargés dans l’ordre, et le navigateur ne verra pas l’image. Il faut soit faire un élément onload, soit mettre la balise script après l’image.

Sinon, je préfère ça :

<a href="..."><img src="monrollover_out.png" onmouseover="this.src='monrollover_over.png';"  onmouseout="this.src='monrollover_out.png';" alt="[...]" /></a>

Ou du CSS.

Oui tu as bien fais de le préciser. J’ai pas regardé plus loin :wink:

<img onmouseover="this.src='rollover.jpg';" onmouseout="this.src='image.jpg';" src="image.jpg">

Déjà dis, tu sors ! :slight_smile:

oops

Bonjour,

Tu veux qu’elle apparaisse où ton images ? devant ? dessous ?