Partage
  • Partager sur Facebook
  • Partager sur Twitter

menu avec CSS

et survol de souris

    5 juillet 2006 à 16:46:01

    Bonjour

    j'étais en train de regzarder les tutos de Mateo et j'ai vu donc qu'on pouvait changer le design en changeant de CSS. Je me suis dit, dans mon site en préparation, il n'y a qu'un CSS en prépartion mais pourquoi pas, plus tard.. Donc autant profiter de cette liberté offerte par le CSS *_*

    Ma question est donc..
    Comment faire pour avoir un menu formé d'image Et dont ces images varent selon si on passe ou non la souris ?
    Bien entendu, j'aurais pu utiliser un truc du genre onmouseover ou onmouseout mais, c'est dans la pae html et donc l'image utilisée est dans la page html et non dans le CSS et donc impossible de la changer si on change de CSS.
    Merci
    • Partager sur Facebook
    • Partager sur Twitter
      5 juillet 2006 à 23:24:44

      entoure tes images de div avec un id et tu pourra leurs appliquer le css
      exemple :

      <div id="image">
         <img src="/image/image.png">
      </div>

      pour utiliser le css selement au passage de la sourie un met :hover apres l'id

      #image:hover
      {
         propriete: valeur;
      }

      voilou ;)
      • Partager sur Facebook
      • Partager sur Twitter
        5 juillet 2006 à 23:38:38

        merci mais en fait dans ce cas la seule chose que jai réussie à faire c'était changer le background de l'image.
        En fait on ma donné un autre code qui fait ce que je veux :p

        #lien1 a {
        display:block;
        width:100%;
        height:100%;
        }
        #lien1 {
        background-image:url("images/puces.png");
        }

        #lien1:hover {
        background-image:url("images/pucs.png");
        }

        avec
        <li id="lien1"><a href="page1.html"><img src="/image/puces.png"></a></li>

        bon ya un petit truc gris à gauche mais ça oit venir du CSS, verrai ça plus tard ^^'
        • Partager sur Facebook
        • Partager sur Twitter
          6 juillet 2006 à 0:38:46

          n'oublie pas =>> mon probleme est resolu
          @+
          • Partager sur Facebook
          • Partager sur Twitter
            6 juillet 2006 à 1:08:22

            Sinon tu crée ton menu normalement, tu maits une image en background de ton lien et tu applique à ce même lien un text-indent: -50000px;. Ainsi ton texte disparait, tes liens marchent, ils changent de fond avec le hover, IE ou non, et si les CSS sont désactivés ou en navigateur texte, le texte originel de tes liens est conservé. Bref, du tout bon ! ;)
            • Partager sur Facebook
            • Partager sur Twitter

            menu avec CSS

            × 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