Partage
  • Partager sur Facebook
  • Partager sur Twitter

agrandir photos

au passage de la souris

Curly
    18 mars 2006 à 8:33:55

    Salut,
    Est ce quelqu'un pourrai me dire comment faire pour qu'une image s'agrandisse au passage de la souris ??
    C'est pour un site que je réalise actuellement et je voudrai arriver a agrandir la photo sans pour autant ouvrir une nouvelle fenetre afin de ne pas gener la navigation !

    @+
    Curly :p
    • Partager sur Facebook
    • Partager sur Twitter
    LaoSeb
      18 mars 2006 à 9:03:03

      Salut,

      Il faut utiliser le :hover sur img. Tu mets le tout dans un div dimensionner a la taille de l'agrandissement pour eviter un debordement de l'image au survol. :p C'est mieux!!!



      <div class="zoomer_une_image">
          <p>
              <img src="ton_image.jpg"
               alt="!!" />
          </p>
      </div>




      .zoomer_une_image {
      height:300px; /*Pour mettre l'image dedans, c'est le conteneur*/
      width: 200px;
      margin: auto;
      }
      .zoomer_une_image p {
      text-align:center;
      }
      .zoomer_une_image img { /*image de depart*/
      width:100px;
      height:100px;
      }
      .zoomer_une_image img:hover { /*image aggrandie*/
      width:200px;
      height:200px;
      }



      Voila, mais cette solution ne marche pas avec ie.

      Tu veux l'autre solution? :p
      • Partager sur Facebook
      • Partager sur Twitter
      Anonyme
        18 mars 2006 à 9:15:38

        onmouseover="this.width = 100px;this.height = 100px;"
        Si je ne m'abuse.
        • Partager sur Facebook
        • Partager sur Twitter
        Curly
          18 mars 2006 à 20:37:22

          merci beaucoup à vous deux !
          • Partager sur Facebook
          • Partager sur Twitter

          agrandir photos

          × 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