[TOUTES VERSIONS] Faire AGRANDIR l'image ou le Smiley au passage de la souris

Bonjour à tous...

J'ai un code qui va dans la "Feuille de style CSS". Cette fonction marche pour tous les formats, dans n'importe quelle version de thème...
Pour ceux qui ont des petits Forums, cela est très pratique !!

Un grossissement au passage de la souris, d'une image ou un smiley, dans vos Blocs de messages !

Exemple en image :




Vous pouvez :

modifier la vitesse du grossissement de l'image au passage de la souris : all 1s ease;
modifier la taille du grossissement de l'image au passage de la souris (1.6);



Suivant votre version :

PhpBB2 et ModernBB:

Code:

      /***DEBUT du code faire AGRANDIR L'IMAGE***/
        .postbody img {
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -ms-transition: all 1s ease;
        -o-transition: all 1s ease;
        transition: all 1s ease;
        }
        .postbody img:hover {
        -webkit-transform:scale(1.6);
        -moz-transform:scale(1.6);
          -ms-transform:scale(1.6);
        -o-transform:scale(1.6);
        transform:scale(1.6);
        }
        /***FIN du code faire AGRANDIR L'IMAGE***/


PhpBB3 et Edge

Code:


      /***DEBUT du code faire AGRANDIR L'IMAGE***/
        .postbody .content img {
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -ms-transition: all 1s ease;
        -o-transition: all 1s ease;
        transition: all 1s ease;
        }
        .postbody .content img:hover {
        -webkit-transform:scale(1.6);
        -moz-transform:scale(1.6);
          -ms-transform:scale(1.6);
        -o-transform:scale(1.6);
        transform:scale(1.6);
        }
        /***FIN du code faire AGRANDIR L'IMAGE***/

PunBB

Code:

 /***DEBUT du code faire AGRANDIR L'IMAGE***/
        .postbody  .entry-content img {
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -ms-transition: all 1s ease;
        -o-transition: all 1s ease;
        transition: all 1s ease;
        }
        .postbody  .entry-content img:hover {
        -webkit-transform:scale(1.6);
        -moz-transform:scale(1.6);
          -ms-transform:scale(1.6);
        -o-transform:scale(1.6);
        transform:scale(1.6);
        }
        /***FIN du code faire AGRANDIR L'IMAGE***/


Invision:

Code:

 /***DEBUT du code faire AGRANDIR L'IMAGE***/
        .postbody  .post-entry img {
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -ms-transition: all 1s ease;
        -o-transition: all 1s ease;
        transition: all 1s ease;
        }
        .postbody  .post-entry img:hover {
        -webkit-transform:scale(1.6);
        -moz-transform:scale(1.6);
          -ms-transform:scale(1.6);
        -o-transform:scale(1.6);
        transform:scale(1.6);
        }
        /***FIN du code faire AGRANDIR L'IMAGE***/


AmesomeBB:

Code:

  /***DEBUT du code faire AGRANDIR L'IMAGE***/
    .post-body .post-content img {
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -ms-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
    }
    .post-body .post-content img:hover{
    -webkit-transform:scale(1.6);
    -moz-transform:scale(1.6);
      -ms-transform:scale(1.6);
    -o-transform:scale(1.6);
    transform:scale(1.6);
    }
    /***FIN du code faire AGRANDIR L'IMAGE***/



Déposez le style concerné dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style



Puis penser a cliquer sur le bouton



Cordialement, Stefano36

De rien Stefano,

on fait tous des erreurs cher ami, moi aussi rassures toi .

J'ai édité ton message pour modifier suivant les versions:

https://www.milouze14.com/t32963-toutes-versions-faire-agrandir-l-image-ou-le-smiley-au-passage-de-la-souris#628879

Puis supprimer les messages qui ne sont pas prévus dans cette section.

Bonjour Phil,

C'est très correct, je ne vais pas éditer ceci !
Tu as très bien résumé la chose !!
Affaire bâclée pour moi !

Merci encore Phil, t'es un bon

Prenez soin de vous,

Cdlt, Stefano