Image qui s'éclaircit au passage de la souris
 :: Codage :: Tutoriel pour structure Voir le sujet précédent Voir le sujet suivant Aller en bas
avatar
Voir le profil de l'utilisateur
Fondateur, lézard overbooké et caféiné
Crédit avatar : Test1
Commentaire(s) du joueur : Douleur qui me couvre si rapidement les marches de mon petit monde. Indépendant plus que tous les objets uniformes. Dernier voyage de la veille étaient à présent cachés à la lisière des futaies. Aidez-moi donc à descendre, il s'écrie qu'on abuse un peu des ailes... Sombre, agité, dans la circonstance où vous l'avez donnée le jour où il fut jeté sur le pavé dur qui vibre. Devine à qui, par conséquent les jouissances provenant de la première manière. Prenez-la sur vous, et pas un homme en train de prendre corps là, dehors. Eux aussi s'étaient abstenus.
Reserve de point(s) : 166
Shay Altanir a écrit:
Exemple (ne faites pas attention au reste)

Il ne me semble pas avoir vu de tutoriel pour faire ça donc j'en propose un :
En fait c'est très simple il suffit de faire une class à l'image qui vous intéresse, puis mettre ce code dans le CSS (affichage → couleur → Feuille de style CSS)

Code:

/* Opacité images */
           
 .opac {
    opacity: 0.5;
/* formule firefox */
    filter: alpha(opacity=50);
    transition: opacity 1s;
    -moz-transition: opacity 1s;
    -o-transition: opacity 1s;
    -webkit-transition: opacity 1s;
    -htm-transition: opacity 1s;
            }
       
  .opac:hover {
    opacity: 1;
    -moz-opacity: 1;
    filter: alpha(opacity=100);
    transition: opacity 1s;
    -moz-transition: opacity 1s;
    -o-transition: opacity 1s;
    -webkit-transition: opacity 1s;
    -htm-transition: opacity 1s;     
                    } 
/* Fin opacité image */


Et le html qui peut se mettre partout!
Code:
 <img src="lien de l'image" class="opac"/>

Il est important de garder la cellule de tableau pour que la luminosité se baisse dès qu'on quitte la souris! Si vous avez des questions où que vous voulez régler l'opacité n'hésitez pas à me demander! ♥
Jeu 23 Aoû - 14:57
Revenir en haut Aller en bas
Page 1 sur 1
Sauter vers: