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 stylePuis penser a cliquer sur le bouton ![[TOUTES VERSIONS] Faire AGRANDIR l'image ou le Smiley au passage de la souris Sans_t10](https://i.servimg.com/u/f87/11/26/21/37/sans_t10.png)
Cordialement, Stefano36