Rappel du premier message :
Sous ce nom très énigmatique se cache quelque chose de très simple que vous allez pouvoir apprécier sur mon forum de test Xooit. Cliquez ici, jeunes padawans.
Vous avez compris le principe ? Cool. Maintenant, place aux codes. N'oubliez pas de créditer Never-Utopia si vous utilisez mon travail
Tout d'abord, il va falloir modifier un template, celle qui répond au doux nom de index_body. Dans ce template, vous allez chercher la charmante balise
ennuis garantis balisage HTML 
!
Il est assez simple malgré quelques subtilités. Vous vous rendrez bientôt compte que, sur Xooit, le plus compliqué, ce ne sont pas les codes, c'est de savoir où les mettre. Je vous souhaite donc beaucoup de courage pour trouver le menu "Sous Forums" si vous démarrez sur cette plateforme.
La suite coule de source. Il faut modifier la description du sous-forum et y insérer ceci :
.
Enregistrez le tout et allez admirer votre boulow !
Voilou, j'espère avoir été clair.
Merci de ne pas copier ce tutoriel qui est mien, et n'oubliez pas le crédit à N-U en cas d'utilisation.
Sous ce nom très énigmatique se cache quelque chose de très simple que vous allez pouvoir apprécier sur mon forum de test Xooit. Cliquez ici, jeunes padawans.
Vous avez compris le principe ? Cool. Maintenant, place aux codes. N'oubliez pas de créditer Never-Utopia si vous utilisez mon travail
Tout d'abord, il va falloir modifier un template, celle qui répond au doux nom de index_body. Dans ce template, vous allez chercher la charmante balise
- Code:
<style>
- Code:
.description
{
display: block;
width: 400px; /*Largeur de votre image*/
margin: auto;
height: 180px; /*Hauteur de votre image*/
overflow: hidden;
}
.description_contenu
{
position: absolute;
width: 400px; /*Largeur*/
height: 180px; /*Hauteur*/
overflow: auto;
background-color: #FFFFFF; /*Couleur de l'arrière-plan de la description*/
font-size: 14px;
font-family:'Georgia';
color: #3E352E;
text-align:center;
padding:0px;
opacity: 0;
-moz-opacity: 0;
-khtml-opacity: 0;
filter: alpha(opacity=0);
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
}
.description_contenu:hover
{
opacity: 0.8;
-moz-opacity: 0.8;
-khtml-opacity: 0.8;
filter: alpha(opacity=80);
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
}
!Il est assez simple malgré quelques subtilités. Vous vous rendrez bientôt compte que, sur Xooit, le plus compliqué, ce ne sont pas les codes, c'est de savoir où les mettre. Je vous souhaite donc beaucoup de courage pour trouver le menu "Sous Forums" si vous démarrez sur cette plateforme.
La suite coule de source. Il faut modifier la description du sous-forum et y insérer ceci :
- Code:
<div class="description"><div style="display: block; text-align: justify; width: 400px; height: 180px; background: url(http://i.imgur.com/minQVys.png) center center no-repeat;"><div class="description_contenu"><div style="OVERFLOW: auto; width: 380px; height: 160px; padding: 10px;">Insérez la description de votre catégorie ici, les coupaings !</div></div></div></div>
- Code:
padding: 10px;
- Code:
width: 380px; height: 160px;
.Enregistrez le tout et allez admirer votre boulow !
Voilou, j'espère avoir été clair.
Merci de ne pas copier ce tutoriel qui est mien, et n'oubliez pas le crédit à N-U en cas d'utilisation.
Un petit merci ou commentaire est toujours le bienvenu ^^
Si vous avez des problèmes avec ce LS ou des questions, venez poster ici.
![[Xooit] Description - effet hover - Page 4 828103KidInk](https://2img.net/r/hpimg15/pics/828103KidInk.png)
