J'ai trouvé ! Ce ne fut pas sans mal mais j'ai la solution.
Voilà comment faire :
Tu vas devoir modifer ton template
index_body.tpl.
Tout au début du code de ce template, tu ajoutes ceci :
- Code:
<style>
.description
{
display: block;
width: 460px;
margin: auto;
height: 60px;
overflow: hidden;
}
.description_contenu
{
position: absolute;
width: 460px;
height: 60px;
overflow:auto;
background-color: #EFE9DD;
font-size: 11.5px;
font-family:'Georgia';
color: #3E352E;
text-align: justify;
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;
}</style>
Attention : j'ai utilisé les dimensions 460*60, s'il faut les changer, repère les endroits où il y a des dimensions dans ce code et modifie-les.
width signifie longueur et
height est la largeur.
Ensuite, tu vas modifier la
description du sous-forum :
- Code:
<div class="description"><div style="display: block; text-align: justify; width: 460px; height: 60px; background: url(URL DE TON IMAGE A INSERER ICI !) center center no-repeat;"><div class="description_contenu"><div style="OVERFLOW: auto; width: 456px; height: 56px; padding: 2px;">Contenu ici - Contenu ici - Contenu ici - Contenu ici - Contenu ici - Contenu ici - Contenu ici - Contenu ici.</div></div></div></div>
Là, c'est pareil, il te faudra modifier les dimensions. Tu remarqueras cette partie du code :
- Code:
456px; height: 56px;
J'ai enlevé 4px, mais c'est volontaire, car il y a une marge intérieure de 2px. C'est ce que signifie le
padding:2px
.
Je te souhaite une bonne soirée !
En cas de doute, le résultat est ici.
Si tu as un pblème pour personnaliser le code, tu me fais un petit coucou !
Hiro'.
Dernière édition par Hiro' le Dim 22 Sep 2013 - 0:14, édité 1 fois