Partage
  • Partager sur Facebook
  • Partager sur Twitter

[JS] Rendre mon image opaque lorsque la souris passe au-dessus

    20 décembre 2005 à 10:47:00

    Bonjour!
    Je commence à apprendre le javascript et je fais des essais mais il y a un truc que je n'arrive pas à faire.
    J'aimerais que quand on passe sur une photo, elle devienne opaque mais je n'arrive pas à le faire.
    Comment faire?

    [Edit] Nyro Xeo > Titre "opacité image" édité.
    • Partager sur Facebook
    • Partager sur Twitter
      20 décembre 2005 à 11:38:22

      Essaye ce code :

      <img src="tonimage.gif" name="imagename" onMouseover="imagename.filters.alpha.opacity=50" onMouseout="imagename.filters.alpha.opacity=100" />


      Par contre je pense que ça ne marchera que sur Internet Explorer :/
      • Partager sur Facebook
      • Partager sur Twitter
        20 décembre 2005 à 18:08:51

        j'ai essayé de cette façon mais je n'y arrive pas
        • Partager sur Facebook
        • Partager sur Twitter
          20 décembre 2005 à 19:11:32

          Bonjours,
          Pas comme ça mais comme ça :
          <img src="tonimage.gif" onMouseover="this.style.filters.alpha.opacity='50'" onMouseout="this.style.filters.alpha.opacity='100'" />

          Et encore, pas sûr que ça marche :)


          Bisous, Nyu
          • Partager sur Facebook
          • Partager sur Twitter
            20 décembre 2005 à 22:02:41

            bonjour!
            j'ai essayé ca

            <script language=javascript>
            var imag = new image();
            imag.src = "Smiley1.gif";
            function opacity()
            {
            document.image.imag.style.filters.alpha.opacity='50';
            }
            </script>
            <a href=# OnMouseover="opacity()"><img src="Smiley1.gif" name="imag"</a>

            Mais ca ne marche pad nom plus alors comment faire?
            • Partager sur Facebook
            • Partager sur Twitter
              21 décembre 2005 à 20:18:07

              Hum...
              <img src="Smiley1.gif" name="image" /></a>
              et :
              document.image.style.filters.alpha.opacity='50';
              Mais pourquoi tu fais pas comme je t'ai dit ?


              Bisous, Nyu
              • Partager sur Facebook
              • Partager sur Twitter
                21 décembre 2005 à 20:23:41

                Sans vouloir vous vexer, je préfererai lui appliquer du code CSS, même si cette solution nécessite une image supplémentaire, celà aura l'avantage d'être effectif même lorsque Javascript est désactivé.

                Si tu cherches juste à faire un test, je m'arrêterai de vous importuner.
                • Partager sur Facebook
                • Partager sur Twitter
                  22 décembre 2005 à 11:24:43

                  Ouaip, avec un simple :hover ça marcherais :)

                  Bisous, Nyu
                  • Partager sur Facebook
                  • Partager sur Twitter
                    22 décembre 2005 à 11:52:39

                    met ceci dans ton css
                    img {
                            border: 0;
                            opacity: 0.5;
                    }
                    img:hover {
                            opacity: 1;
                    }

                    chez moi ca marche tres bien sous firefox
                    • Partager sur Facebook
                    • Partager sur Twitter
                      22 décembre 2005 à 12:05:15

                      Tu ne voulais pas plutôt parler de :
                      filter: alpha(opacity=1)
                      ?

                      Quoi qu'il en soit, c'est une propriété propriétaire IE, moi je pensais, au même titre que Dutiona, à faire une image en roll-over ...
                      • Partager sur Facebook
                      • Partager sur Twitter
                        23 décembre 2005 à 14:48:45

                        En faite j'aimerais que quelqu'un me propose une solution en javascript car j'étudie plus le fond que la forme donc je m'en fout d'avoir une image opaque j'essaie de le faire et ca ne marche pas alors je demande de l'aide
                        Merci :p
                        • Partager sur Facebook
                        • Partager sur Twitter

                        [JS] Rendre mon image opaque lorsque la souris passe au-dessus

                        × 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