Partage
  • Partager sur Facebook
  • Partager sur Twitter

Image dans un div

qui est remplacée quand rollover avec la souris

mrjay42
    11 avril 2006 à 15:38:04

    Hello les zéros!!

    Voila j'ai besoin de faire un truc trés con mais figurez vous que je n'y arrive pas :

    Imaginez une page HTML
    Dedans un simple div...oui oui juste un!

    Admettons que je veuille que ce calque contienne une image (et rien d'autre pas de texte)
    ET que quand je passe la souris dessus une autre image se charge à la place de celle qui est affichée...

    Comment faire!!!!!?.???????

    Je me doute qu'il faut utiliser une class ou un ID avec ":hover" mais franchement je n'y arrive pas!!!

    merci d'avance
    • Partager sur Facebook
    • Partager sur Twitter

    Si y'a pas d'accents dans mes messages c'est parce que je suis sur un clavier norvegien :)

    strucky
      11 avril 2006 à 15:52:37

      Salut,

      Le seul hic en faisant ça sur autre chose que le a, ne fonctionnera pas avec IE.

      <html>
        <head>
        <title></title>
        <style type="text/css">
        <!--
         a{ display: block; width: 80px; height: 80px; background: #00f; cursor: default }
         a:hover{ background: #f00 }
        //-->
        </style>
        </head>
        <body>
       
        <a href="#"></a>
       
        </body>
      </html>
      • Partager sur Facebook
      • Partager sur Twitter
      Riko
        11 avril 2006 à 16:08:10

        Je pense que ceci devrait fonctionner

        <a class="image" title="description" href="lien.htm"></a>

        a.image { /* définition de la classe "image" de la balise <a> */
             display: block; /* la balise a doit être en bloc */
             width: 60px; /* largeur de l'image réactive */
             height: 40px; /* hauteur de l'image réactive */
             background-image: url(image.jpg); /* source de l'image de départ */
             background-repeat: no-repeat;
             }
                 
        a.image:hover { /* définition de la classe "image" de la balise <a> au survol */
             background-image: url(image2.jpg); /* source de l'image d'arrivée */
             } -->


        Voir ici
        • Partager sur Facebook
        • Partager sur Twitter
        mrjay42
          11 avril 2006 à 17:18:08

          merci merci pour toute vos réponses
          je test ca demain au boulot mais a priori c nikel
          • Partager sur Facebook
          • Partager sur Twitter

          Si y'a pas d'accents dans mes messages c'est parce que je suis sur un clavier norvegien :)

          Image dans un div

          × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
          × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
          • Editeur ●
          • Markdown