Bonjour!^^
Tout d'abord je tiens à mentionner que lorsqu'il s'agit de toucher aux templates, je suis plutôt nulle... Donc voilà, je viens d'installer un Qui est en ligne en onglets sur mon forum et le Qui est en ligne en question n'affiche pas les statistiques etc... lorsqu'on passe la souris sur l'onglet approprié.
Voici l'adresse de mon forum :
http://ucla.forum-canada.com/
Voici mon CSS au complet :
- Spoiler:
- Code:
-
/* CONTOUR AVATAR */
.postdetails.poster-profile a img {
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
border: 5px solid #D2AF44;
}
/* BARRE NAVIGATION MAJUSCULE */
a.mainmenu {
text-transform: uppercase;
}
a.mainmenu:hover { /* pour le survol */
text-transform: uppercase;
}
tr.post span.gensmall {
display: none !important;
}
.forumline{
border: 1px #A9BCD9
dashed;
}
.postbody {
display: block;
padding-left: 100px;
padding-right: 100px;
text-align:justify;
}
a.forumlink:link, a.forumlink:visited {
font-family: georgia;
text-transform : uppercase;
text-align: center;
font-size: 100%;
border-bottom: 5px solid #dad7a2;
color: #dad7a2;
letter-spacing: 1px;
display: block;
-moz-border-radius:10px;
}.postdetails.poster-profile a img {
margin: auto;
display: block;
margin-bottom: -10px;
}
a.forumlink:hover, a.forumlink:hover:visited {
background-image: url("http://img337.imageshack.us/img337/953/blutexture2.jpg");
color: #729aa3;
text-align: center;
display: block;
border-bottom: 5px solid #729aa3;
-moz-border-radius:10px;
}
.a {
font-variant: small-caps;
}
table.bodylinewidth
{
position: relative;
top: -9px;
}
.postbody, td.row1 span.gensmall {
text-align: justify !important;
display: block;
}
padding-left: 100px;
padding-right: 100px;
.postdetails.poster-profile a img {
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
border: 5px solid #dad7a2;
}
/* =================
===== Message d'accueil =====
script by James1920 de CSSACTIF et LBTPROD - Novembre 13, 2010
http://www.themes-fa.com - BY-NC (http://creativecommons.org/licenses/by-nc/2.0/fr/)
================= */
/*----------------- Ma g�n�ral ----------------- */
/* Pour les défilement */
#scroller_container
{
padding-top: 15px;
overflow: hidden;
}
/* CSS Hack Safari */
#dummy
{
;#
}
#scroller_container
{
overflow: auto;
}
/*le tableau invisible */
.table25
{
border: none ;
}
/* Liens */
.a2
{
display: block;
width: 130px;
color: black;
text-align:center;
border: 1px white;
-moz-border-radius: 5px;
height: 30px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
}
.a2:hover
{
background-color: white;
color: blue;
}
#table22 /* fond du ma */
{
width: 770px;
background-color: #dad7a2;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-khtml-border-radius: 15px;
border-radius: 15px;
}
/*-----------------Titre----------------- */
/* Le titre special pour le texte de bienvenu */
.h2_themebienvenu
{
font-size: 14px;
background-color: #e7f0f2;
padding: 6px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
color: black;
text-align: center;
margin: 10px;
/max-width: 367px;
}
/* le titre special pour les credits */
.h2_themecredit
{
font-size: 14px;
background-color: #e7f0f2;
padding: 6px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
color: black;
text-align: center;
margin: 10px;
/max-width: 160px;
}
/* le titre pour les autres boites */
.h2_theme
{
font-size: 14px;
background-color: #e7f0f2;
padding: 6px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
color: black;
text-align: center;
margin: 10px;
}
/* effet de transparance FF */
.transparence {
background-color: transparent;
border: none;
opacity: 0.5;
}
.transparence:hover{
background-color: transparent;
border: none;
opacity: 2;
}
/*-----------------Les boites contenant les textes----------------- */
/* Navigation */
.navi_ma
{
background-color:#e7f0f2;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
color: black;
font-size: 16px;
height: 300px;
margin: 10px;
width: 130px;
padding: 5px;
line-height:34px;
-webkit-box-shadow: 4px 4px 0 #e6e6e6;
-moz-box-shadow: 4px 4px 0 #e6e6e6;
-khtml-box-shadow: 4px 4px 0 #e6e6e6;
padding-top: 20px;
}
/* News */
.news
{
background-color: #e7f0f2;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
color: black;
font-size: 14px;
height: 120px;
width: 160px;
margin: 10px;
overflow-y: auto;
overflow-x: visible;
padding: 5px;
-webkit-box-shadow: 4px 4px 0 #e6e6e6;
-moz-box-shadow: 4px 4px 0 #e6e6e6;
-khtml-box-shadow: 4px 4px 0 #e6e6e6;
}
/* Partenaires */
.partenaire_test
{
background-color: #e7f0f2;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
color: black;
font-size: 14px;
height: 105px;
width: 160px;
margin: 10px;
padding: 5px;
-webkit-box-shadow: 4px 4px 0 #e6e6e6;
-moz-box-shadow: 4px 4px 0 #e6e6e6;
-khtml-box-shadow: 4px 4px 0 #e6e6e6;
padding-top: 20px;
}
/* message de bienvenu */
#bienvenu_ma
{
background-color: #e7f0f2;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
color: black;
font-size: 14px;
height: 120px;
margin: 10px;
overflow-y: auto;
overflow-x: visible;
padding: 5px;
-webkit-box-shadow: 4px 4px 0 #e6e6e6;
-moz-box-shadow: 4px 4px 0 #e6e6e6;
-khtml-box-shadow: 4px 4px 0 #e6e6e6;
width: 370px;
}
/* membres staffs */
.staff
{
background-color: #e7f0f2;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
color: black;
font-size: 10px;
height: 105px;
width: 180px;
margin: 10px;
padding: 5px;
font-size: 14px;
-webkit-box-shadow: 4px 4px 0 #e6e6e6;
-moz-box-shadow: 4px 4px 0 #e6e6e6;
-khtml-box-shadow: 4px 4px 0 #e6e6e6;
padding-top: 20px;
}
/*crédits */
.credits
{
background-color: #e7f0f2;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
color: black;
font-size: 14px;
height: 105px;
width: 160px;
margin: 10px;
padding: 5px;
-webkit-box-shadow: 4px 4px 0 #e6e6e6;
-moz-box-shadow: 4px 4px 0 #e6e6e6;
-khtml-box-shadow: 4px 4px 0 #e6e6e6;
padding-top: 20px;
}
/*-----------------inffobulles----------------- */
div.infobulle
{
position: relative;
float: left;
color: black;
}
div.infobulle span
{
display: none; /* ceci masque l'infobulle */
}
div.infobulle:hover
{
background: none; /* correction d'un bug IE */
z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
color: black;
}
/* style de l infobulle */
div.infobulle:hover span
{
display: inline; /* on affiche l'infobulle */
position: absolute;
top: 10px; /* on positionne notre infobulle */
background-color: #e7f0f2;
color: black;
padding: 3px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
text-align: center;
font-size: 14px;
}
/*EFFET TEXTE*/
.lettrine {
float: left; font-size: 90px; padding-top: 10px; margin-bottom: 10px; border: 5px solid #09C; background-color:#900; text-align: center; font-family: Monotype Corsiva; color: #FFF; height: 40px;}
/*Catégories*/
a.forumlink{"-moz-border-radius: 7px 7px 7px 7px;
font-weight: lighter;
background-color: #ededed;
border-bottom: 5px double #ededed;
display:block;
text-align: center;
-moz-border-radius: 7px 7px 7px 7px;
}
.contour {
text-align: center;
border: 1px solid #D2AF44;
padding: 5px;
margin: 0px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
/* QEEL */
.onglet { background-color: # ;
border-right: 5px solid #3D4952;
border-left: 5px solid #3D4952;
border-top: 1px dotted #3D4952;
border-bottom: 1px dotted #3D4952;
padding-top: 3px;
padding-bottom: 3px;
padding-left: 0px;
padding-right: 0px;
font-family: verdana;
font-weight: bold; text-align: center;
color: #3D4952;}
.message { background-color: #;
border-right: 5px solid #3D4952;
border-left: 5px solid #3D4952;
border-top: 1px dotted #3D4952;
border-bottom: 1px dotted #3D4952;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 30px;
padding-right: 30px;
font-family: verdana;
text-align: center;
color: #3D4952;}
et mon template index_body ( seulement la partie modifiée ):
- Spoiler:
- Code:
-
<!-- BEGIN disable_viewonline -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0"><tr><td class="row1" rowspan="3" align="center" valign="middle">
<div class="gensmall"><script type="text/javascript">
function patonglet1() { document.getElementById('onglet1').style.display='block'; document.getElementById('onglet2').style.display='none';
document.getElementById('onglet3').style.display='none'; document.getElementById('onglet4').style.display='none'; }
function patonglet2() { document.getElementById('onglet1').style.display='none'; document.getElementById('onglet2').style.display='block';
document.getElementById('onglet3').style.display='none'; document.getElementById('onglet4').style.display='none'; }
function patonglet3() { document.getElementById('onglet1').style.display='none'; document.getElementById('onglet2').style.display='none';
document.getElementById('onglet3').style.display='block'; document.getElementById('onglet4').style.display='none'; }
function patonglet4() { document.getElementById('onglet1').style.display='none'; document.getElementById('onglet2').style.display='none';
document.getElementById('onglet3').style.display='none'; document.getElementById('onglet4').style.display='block'; }</script>
<!-- BARRE D'ONGLETS -->
<table width="100%"><tr>
<td width="20%"><div class="onglet" ="javascript:patonglet1()">Statistiques</div></td>
<td width="20%"><div class="onglet" ="javascript:patonglet2()">Les groupes</div></td>
<td width="20%"><div class="onglet" ="javascript:patonglet3()">Les dernières connexions</div></td></tr></table>
<table width="100%">
<tr width="100%">
<td width="100%">
<!-- PREMIER MODULE -->
<div id="onglet1">
<div class="message">
<table width="100%" border="0" cellpadding="10" cellspacing="1">
<tr>
<td style="text-align: center;" width="100%"><span class="gensmall">{TOTAL_POSTS}
{TOTAL_USERS}
{NEWEST_USER}
{TOTAL_USERS_ONLINE}
{RECORD_USERS}
{LOGGED_IN_USER_LIST}</span>
</td>
</tr>
</table>
</div>
</div>
<!-- DEUXIEME MODULE -->
<div id="onglet2" style="display: none;">
<div class="message">
<table width="100%" border="0" cellpadding="10" cellspacing="1">
<tr>
<td style="text-align: center;" width="100%">
{GROUP_LEGEND}
</td>
</tr>
</table>
</div>
</div>
<!-- TROISIEME MODULE -->
<div id="onglet3" style="display: none;">
<div class="message">
<table width="100%" border="0" cellpadding="10" cellspacing="1">
<tr>
<td style="text-align: center;" width="100%">
{L_CONNECTED_MEMBERS}
</td>
</tr>
</table>
</div>
</div>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
<!-- END disable_viewonline -->
Je me doute qu'il faut changer des choses, mais j'ignore quoi
. Je me demandais aussi s'il y a un endroit pour mettre une image? Je remercie énormément la personne qui voudra bien m'aider et m'excuse de mon ignorance totale
.
EDIT Ikø': N'oublie pas de mettre les balises codes autour de ton code la prochaine fois :DD