Accueil
Créer un forumOnglets catégories à gauche
3 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 2 • Partagez
Page 1 sur 2 • 1, 2 
Onglets catégories à gauche
par Rikku-Chan Dim 22 Juil 2012 - 20:56
Bonjour =D
Je viens ici car j'ai des onglets de catégories mais j'aimerai qu'à la place de les trouver au dessus des catégories, les retrouver plutôt à gauche des catégories, comme ceci : https://i.servimg.com/u/f41/14/11/46/51/a10.jpg
Voici mon index-box :
Merci d'avance à la personne qui prendra ma commande en charge ^^
Je viens ici car j'ai des onglets de catégories mais j'aimerai qu'à la place de les trouver au dessus des catégories, les retrouver plutôt à gauche des catégories, comme ceci : https://i.servimg.com/u/f41/14/11/46/51/a10.jpg
Voici mon index-box :
- Spoiler:
- Code:
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<tr>
<td valign="bottom">
<!-- BEGIN switch_user_logged_in -->
<span class="gensmall">{LAST_VISIT_DATE}<br>
{CURRENT_TIME}
</span>
<!-- END switch_user_logged_in -->
<div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
</td>
<td class="gensmall" align="right" valign="bottom">
<!-- BEGIN switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br>
<a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br>
<!-- END switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
</td>
</tr>
</table>
<div id="conteneur_onglets">
<center><table><tr>
<td class="onglet"><div><img src="http://i41.servimg.com/u/f41/16/11/46/37/incipi11.png" /></div></td>
<td class="onglet"><div><img src="http://i41.servimg.com/u/f41/14/11/46/51/contin10.png" /></div></td>
<td class="onglet"><div><img src="http://i41.servimg.com/u/f41/16/11/46/37/midgar12.png" /></div></td>
<td class="onglet"><div><img src="http://i41.servimg.com/u/f41/16/11/46/37/contin11.png" /></div></td>
<td class="onglet"><div><img src="http://i41.servimg.com/u/f41/16/11/46/37/contin14.png" /></div></td>
<td class="onglet"><div><img src="http://i41.servimg.com/u/f41/16/11/46/37/iles_d12.png" /></div></td>
<td class="onglet"><div><img src="http://i41.servimg.com/u/f41/16/11/46/37/excipi11.png" /></div></td>
</tr></table></center>
</div>
<div id="conteneur_categories">
<!-- BEGIN catrow --><!-- BEGIN tablehead -->
<div class="categorie">
<div class="haut2"></div>
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<tr>
<th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
<th nowrap="nowrap" width="150"><div style="width:150px;"></div></th>
</tr>
<!-- END tablehead -->
<!-- BEGIN cathead -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
<!-- END inc -->
<td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
<h{catrow.cathead.LEVEL} class="hierarchy">
<span class="cattitle">
<a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
</span>
</h{catrow.cathead.LEVEL}>
</td>
<td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
</tr>
<!-- END cathead -->
<!-- BEGIN forumrow -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
<!-- END inc -->
<td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle"><br>
<img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
</td>
<td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
<table width="100%"><tbody><tr><td><h{catrow.forumrow.LEVEL} class="hierarchy">
<span class="forumlink">
<a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
</span>
</h{catrow.forumrow.LEVEL}></td></tr></tbody></table>
<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
<span class="gensmall">
<!-- BEGIN switch_moderators_links -->
{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
<!-- END switch_moderators_links -->
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
</span>
</td>
<td class="row3 over" align="center" valign="middle" height="50"><br>
<div class="cadre1">{catrow.forumrow.POSTS} messages • {catrow.forumrow.TOPICS} sujets<br>
<span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
</td>
</tr>
<!-- END forumrow -->
<!-- BEGIN catfoot -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
<!-- END inc -->
<td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
</tr>
<!-- END catfoot -->
<!-- BEGIN tablefoot -->
</table><div class="bas2"></div><img src="{SPACER}" alt="" height="5" width="1" /></div>
<!-- END catrow --><!-- END tablefoot -->
</div>
Merci d'avance à la personne qui prendra ma commande en charge ^^
Dernière édition par Rikku-Chan le Dim 12 Aoû 2012 - 17:06, édité 1 fois
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Re: Onglets catégories à gauche
par Rikku-Chan Lun 30 Juil 2012 - 14:47
UP s'il vous plait =)
Quelqu'un sait-il comment faire ? =)
Quelqu'un sait-il comment faire ? =)
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Re: Onglets catégories à gauche
par Rikku-Chan Mer 1 Aoû 2012 - 19:21
UP s'il vous plait.
Quelqu'un peut-il m'aider ? =)
Merci bien d'avance.
Quelqu'un peut-il m'aider ? =)
Merci bien d'avance.
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Re: Onglets catégories à gauche
par Rikku-Chan Jeu 2 Aoû 2012 - 21:15
UP ^^
Quelqu'un sait-il comment faire ?
Quelqu'un sait-il comment faire ?
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Re: Onglets catégories à gauche
par PandaP Lun 6 Aoû 2012 - 16:15
Bonjour.
Je penses savoir comment je vais voir ^^
Je penses savoir comment je vais voir ^^
Dernière édition par PandaP le Lun 6 Aoû 2012 - 16:29, édité 1 fois
PandaP- *
- Messages : 39
Inscrit(e) le : 10/06/2012
Re: Onglets catégories à gauche
par Rikku-Chan Lun 6 Aoû 2012 - 16:19
Bonjour =D
Vous avez une idée de comment faire ? =)
Si oui, voici mon template index box :
Je vous l'ai redonné car je ne sais plus si j'ai fais des changements depuis, je ne pense pas mais par sécurité xD
Merci bien ^^
Vous avez une idée de comment faire ? =)
Si oui, voici mon template index box :
- Spoiler:
- Code:
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<tr>
<td valign="bottom">
<!-- BEGIN switch_user_logged_in -->
<span class="gensmall">{LAST_VISIT_DATE}<br>
{CURRENT_TIME}
</span>
<!-- END switch_user_logged_in -->
<div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
</td>
<td class="gensmall" align="right" valign="bottom">
<!-- BEGIN switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br>
<a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br>
<!-- END switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
</td>
</tr>
</table>
<div id="conteneur_onglets">
<center><table><tr>
<td class="onglet"><div><img src="http://i41.servimg.com/u/f41/16/11/46/37/incipi11.png" /></div></td>
<td class="onglet"><div><img src="http://i41.servimg.com/u/f41/14/11/46/51/contin10.png" /></div></td>
<td class="onglet"><div><img src="http://i41.servimg.com/u/f41/16/11/46/37/midgar12.png" /></div></td>
<td class="onglet"><div><img src="http://i41.servimg.com/u/f41/16/11/46/37/contin11.png" /></div></td>
<td class="onglet"><div><img src="http://i41.servimg.com/u/f41/16/11/46/37/contin14.png" /></div></td>
<td class="onglet"><div><img src="http://i41.servimg.com/u/f41/16/11/46/37/iles_d12.png" /></div></td>
<td class="onglet"><div><img src="http://i41.servimg.com/u/f41/16/11/46/37/excipi11.png" /></div></td>
</tr></table></center>
</div>
<div id="conteneur_categories">
<!-- BEGIN catrow --><!-- BEGIN tablehead -->
<div class="categorie">
<div class="haut2"></div>
<div class="contenucat"><div style="margin-left:15px;"><table class="forumline" width="750px" border="0" cellspacing="1" cellpadding="0">
<tr>
<th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
<th nowrap="nowrap" width="150"><div style="width:150px;"></div></th>
</tr>
<!-- END tablehead -->
<!-- BEGIN cathead -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
<!-- END inc -->
<td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
<h{catrow.cathead.LEVEL} class="hierarchy">
<span class="cattitle">
<a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
</span>
</h{catrow.cathead.LEVEL}>
</td>
<td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
</tr>
<!-- END cathead -->
<!-- BEGIN forumrow -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
<!-- END inc -->
<td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle"><br>
<img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
</td>
<td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
<table width="100%"><tbody><tr><td><h{catrow.forumrow.LEVEL} class="hierarchy">
<span class="forumlink">
<a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
</span>
</h{catrow.forumrow.LEVEL}></td></tr></tbody></table>
<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
<span class="gensmall">
<!-- BEGIN switch_moderators_links -->
{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
<!-- END switch_moderators_links -->
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
</span>
</td>
<td class="row3 over" align="center" valign="middle" height="50"><br>
<div class="cadre1">{catrow.forumrow.POSTS} messages • {catrow.forumrow.TOPICS} sujets<br>
<span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
</td>
</tr>
<!-- END forumrow -->
<!-- BEGIN catfoot -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
<!-- END inc -->
<td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
</tr>
<!-- END catfoot -->
<!-- BEGIN tablefoot -->
</table></div>
</div><div class="bas2"></div><img src="{SPACER}" alt="" height="5" width="1" /></div>
<!-- END catrow --><!-- END tablefoot -->
</div>
Je vous l'ai redonné car je ne sais plus si j'ai fais des changements depuis, je ne pense pas mais par sécurité xD
Merci bien ^^
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Re: Onglets catégories à gauche
par PandaP Lun 6 Aoû 2012 - 17:37
Coucou ok, mais tu coup j'aurais besoin de ton css et javascript si il y a pour les disposer correctement :/
PandaP- *
- Messages : 39
Inscrit(e) le : 10/06/2012
Re: Onglets catégories à gauche
par Rikku-Chan Lun 6 Aoû 2012 - 18:21
Pas de soucis ^^
Voici mon CSS :
Pour le javascript, voici le code :
Merci bien =)
Voici mon CSS :
- Spoiler:
- Code:
a.forumlink {
background-color: #transparent;
text-shadow: #FFFFFF 1px 1px 1px;
color: #C72C48;
display: block;
font-family: georgia;
font-size: 15px;
text-transform: uppercase;
text-align: right;
padding-right: 5px;
letter-spacing: -1px;
-o-transition: all 1.5s ease;
-moz-transition: all 1.5s ease;
-webkit-transition: all 1.5s ease;
position: relative;
top: 5px;
opacity: 0.9;
}
a.forumlink:hover{
background-color: #transparent;
text-shadow: #FFFFFF 1px 1px 1px;
color: #949292;
display: block;
font-family: georgia;
font-size: 15px;
text-transform: uppercase;
text-align: right;
padding-right: 5px;
letter-spacing: -1px;
position: relative;
top: 5px;
opacity:1;
}
.contenucat {
background: url("http://img269.imageshack.us/img269/5866/fondma.png") repeat scroll 0 0 transparent;
width: 780px;
position: relative;
margin-bottom: -22px;
}
.titreforum {
margin-top: -190px;
position: absolute;
margin-left: -280px;
}
.haut2 {
background: url("http://i41.servimg.com/u/f41/16/11/46/37/kap0hq10.png") no-repeat scroll 0 0 transparent;
height: 200px;
position: relative;
margin-bottom: -22px;
}
.bodylinewidth {width: 780px !important;}
/* QEEL LOCKER */
#all_qeel{
width: 709px;
margin: 10px auto;
padding: 0;
position: relative;
}
#tfa_qeel_lock{
width: 709px;
height: 259px;
background: url(http://i41.servimg.com/u/f41/14/11/46/51/ru9qhy10.png) no-repeat;
margin: auto;
padding: 0;
border-radius: 9px;
}
/* BLOC DE DROITE */
#block_lockstatt{
width: 300px;
float: right;
margin: 6px 25px 0 0;
padding: 0 5px;
background:#E3E3E3;
border-radius: 9px;
box-shadow: 0 0 3px #000;
opacity: 0.7;
}
#lock_stattdroit{
width: 300px;
margin: 0;
padding: 0;
}
/* CONTENU DU BLOC */
.in_stattdroit{
width: 96%;
margin: 5px auto;
padding: 0;
height: 130px;
overflow-y: auto;
font: 10px Arial;
color: #C72C48;
text-align: justify;
}
/* ---- PARTIE GROUPES ---- */
#groupes_qeel{
width: 706px;
height: 45px;
margin: auto;
padding: 0;
position: relative;
}
.tfa_groupes{
width:100%;
margin: 0;
padding: 0;
position: absolute;
top: 7px;
text-align: center;
}
/* BLOC INFOBULLE GROUPE */
.bul_group{
width: 94px;
float:left;
margin: 3px;
padding: 0;
position: relative;
}
.in_groupe{
background: #791E3A;
border: 0px solid #860049;
width: 86px;
height: 0;
position: relative;
bottom: 0;
left: 4px;
overflow: hidden;
z-index: 20;
-moz-border-radius: 0 0 10px 10px;
-webkit-border-radius:0 0 10px 10px;
border-radius: 0 0 10px 10px;
opacity: 0;
filter : alpha(opacity=0);
-webkit-transition: all 1.5s ease; /* pour navigateur webkit */
-moz-transition: all 1.5s ease; /* pour navigateur mozilla */
-o-transition: all 1.5s ease; /* pour navigateur opera */
transition: all 1.5s ease; /* pour les navigateurs récents */
}
.bul_group:hover .in_groupe{
height: 60px;
border-width: 1px;
opacity: 0.9;
filter : alpha(opacity=90);
}
.in_groupe span{
display: block;
width: 96%;
margin: 0 auto;
padding: 3px 0 0 0;
text-align: center;
font: 9px Arial;
color: #fff;
}
/* BOUTON GROUPE */
.the_groupe{
display: inline-block;
width: 90px;
height: 22px;
vertical-align: middle;
text-align: center;
font: 15px Arial;
margin: 0;
padding: 2px;
background: #F9A8CD;
border: 1px solid #e7f2f6;
-moz-border-radius: 6px;
-webkit-border-radius:6px;
border-radius: 6px;
box-shadow: 0 0 1px #000;
text-shadow: 0 1px 0 #000;
}
/* ------ BLOC DU BAS ------ */
#bas_block2{
width: 100%;
position: relative;
top: -2px;
margin: 0;
padding: 0;
}
/* BLOC DE GAUCHE(en ligne) */
#bas_block_gauche2{
width: 49%;
float: left;
position: relative;
margin: 0 0 0 1%;
padding: 0;
}
/* BLOC DE DROITE(anniversaires) */
#bas_block_droite2{
width: 49%;
float: right;
position: relative;
margin: 0 1% 0 0;
padding: 0;
}
/* BLOC TRANSITION QEEL */
.bul-q{
position: absolute;
left: 0;
width: 100%;
margin: 0 auto;
padding: 0;
z-index: 3;
}
.in_q_b{
background: #E3E3E3;
border: 1px solid #fff;
border-top: 0;
box-shadow: 0 1px 1px #999999;
position: relative;
height: 0;
overflow: hidden;
color: #C72C48;
-webkit-transition: all 1.2s ease; /* pour navigateur webkit */
-moz-transition: all 1.2s ease; /* pour navigateur mozilla */
-o-transition: all 1.2s ease; /* pour navigateur opera */
transition: all 1.2s ease; /* pour les navigateurs récents */
-moz-border-radius: 0 0 6px 6px;
-webkit-border-radius:0 0 6px 6px;
border-radius: 0 0 6px 6px;
}
.bul_op{
display: block;
position: relative;
width: 150px;
height: 16px;
background: #E3E3E3;
border: 1px solid #fff;
border-top: 0;
box-shadow: 0 1px 1px #999999;
margin: -1px auto 0;
padding: 1px 0 0 0;
font: 12px Arial;
color: #C72C48;
text-shadow: 0 1px 0 #C2D1E0;
text-align: center;
-moz-border-radius: 0 0 6px 6px;
-webkit-border-radius:0 0 6px 6px;
border-radius: 0 0 6px 6px;
}
.bul-q:hover .in_q_b{
height: 70px;
padding: 3px;
}
.haut_b{
width: 98%;
height: 66px;
font: 11px Arial;
margin: auto;
padding: 3px 0;
overflow-y: auto;
}
.haut_b .row1, .haut_b .gensmall, haut_b .row1 .gensmall{
font: 11px Arial;
color: #C72C48;
background: transparent;
border: none;
}
.haut2{
background: url("http://i41.servimg.com/u/f41/16/11/46/37/kap0hq10.png") no-repeat transparent;
height: 200px;
margin: 0 auto;
}
.bas2{
background: url("http://i41.servimg.com/u/f41/16/11/46/37/1eg1rc10.png") no-repeat transparent;
height: 200px;
margin: 0 auto;
}
.navig {
font-family: georgia;
background-color: #D9D9D9;
background-repeat: repeat-x;
background-position: center ;
letter-spacing: -1px;
font-size: 11px;
width : 802px;
-moz-border-radius-topleft: 30px;
-moz-border-radius-topright: 30px;
border-radius-topleft: 30px;
border-radius-topright: 30px;
margin: 0 auto;
}
.navig:hover {
font-family: georgia;
background-color: #D9D9D9;
background-repeat: repeat-x;
background-position: center ;
letter-spacing: -1px;
font-size: 11px;
-moz-border-radius-topleft: 30px;
-moz-border-radius-topright: 30px;
border-radius-topleft: 30px;
border-radius-topright: 30px;
margin: 0 auto;
}
.bodyline { /* GROSSIR LE CADRE AUTOUR DU FORUM */
border-right: 0px solid #D9D9D9;
border-left: 0px solid #D9D9D9;
border-top: 0px solid #D9D9D9;
border-bottom: 0px solid #D9D9D9;
-moz-border-radius: 0px 0px 0px 0px;
border-radius: 0px 0px 0px 0px;
}
div.info_profil div {
display:none;
}
div.info_profil:hover {
background: none;
z-index: 999;
cursor: hand;
position: relative;
text-decoration:none;
border: 0;
}
div.info_profil:hover div {
font-style: normal;
font-size: 10px;
color:#576780 !important;
padding: 3px;
display: block;
position: absolute;
top: 170px;
left: 9px;
-moz-border-radius: 7px 7px 7px 7px ;
-webkit-border-radius: 7px 7px 7px 7px ;
border-radius: 7px 7px 7px 7px ;
-moz-box-shadow: 0px 0px 4px #000;
-webkit-box-shadow: 0px 0px 4px #000;
box-shadow: 0px 0px 4px #000;
background-color: #000000;
border: 2px solid #000000;
width:180px;
}
/* CSS pour le conteneur des catÈgories */
#conteneur_categories
{
}
/* CSS pour les catÈgories */
.categorie
{
}
/* CSS pour le conteneur des onglets */
#conteneur_onglets
{
display: none;
}
/* CSS pour les onglets */
.onglet
{
cursor: pointer;
}
/* icone en ligne-hors ligne */
#post_onlin{
background: url('http://i41.servimg.com/u/f41/16/11/46/37/offlin13.png') no-repeat;
position: absolute;
float: left;
width: 20px;
height: 127px;
margin-left: -17px;
margin-top: 40px;
padding: 0;
border: 0;
}
/* début boutons monter descendre */
.top_bottom{
position: fixed;
bottom: 40px;
right: 0px;
background-color:#OFOFOF;
background-image:
-moz-linear-gradient(
top,
rgba(255,255,255,0.25),
rgba(255,255,255,0.05)
);
background-image:
-webkit-gradient(
linear,
left top,
left bottom,
color-stop(0, rgba(255,255,255,0.25)),
color-stop(1, rgba(255,255,255,0.05))
);
border:1px solid #111;
-moz-border-radius: 9px 0px 0px 9px;
-webkit-border-radius: 9px 0px 0px 9px;
border-radius: 9px 0px 0px 9px;
-moz-box-shadow: 1px 1px 3px #000;
-webkit-box-shadow: 1px 1px 3px #000;
box-shadow: 1px 1px 3px #000;
z-index: 999;
padding: 8px;
}
.top_bottom:hover{
-moz-box-shadow: 1px 1px 5px #FFFFFF;
-webkit-box-shadow: 1px 1px 5px #FFFFFF;
box-shadow: 1px 1px 5px #FFFFFF;
}
.haut{width:18px; height:22px; background:url(http://i41.servimg.com/u/f41/16/11/46/37/112.png) no-repeat 0 0;}
.haut:hover{background:url(http://i41.servimg.com/u/f41/16/11/46/37/112.png) no-repeat 0 -22px;}
.bas{width:18px; height:22px; background:url(http://i41.servimg.com/u/f41/16/11/46/37/211.png) no-repeat 0 0;}
.bas:hover{background:url(http://i41.servimg.com/u/f41/16/11/46/37/211.png) no-repeat 0 -22px;}
/* fin boutons monter descendre */
.imgbas2 {
background-image : url("http://i41.servimg.com/u/f41/16/11/46/37/chibi17.png");
background-repeat : no-repeat;
width : 117px;
height : 175px;
position : fixed;
bottom : 0px;
right : 10px;
}
.code { /* personnalisation d'un code */
background-color: #0F0F0F;
border-left: 3px solid #576780;
-moz-border-radius: 17px 0px 0px 0px;
border-radius: 17px 0px 0px 0px;
color: #525252;
padding-left: 1px;
}
.code:hover {
border-left: 3px solid #3F4B5E;
-moz-border-radius: 17px 0px 0px 0px;
border-radius: 17px 0px 0px 0px;
color: #525252;
}
.quote { /* personnalisation d'une citation */
background-color: #0F0F0F;
border-left: 3px #576780 solid;
-moz-border-radius: 17px 0px 0px 0px;
border-radius: 17px 0px 0px 0px;
color: #525252;
}
.quote:hover {
border-left: 3px #3F4B5E solid;
-moz-border-radius: 17px 0px 0px 0px;
border-radius: 17px 0px 0px 0px;
color: #525252;
}
.spoiler_content{ /* personnalisation d'un spoiler */
background-color: #0F0F0F;
border-left: 3px solid #3F4B5E;
border-bottom: 1px solid #3F4B5E;
-moz-border-radius: 17px;
border-radius: 17px;
}
.spoiler_closed{ /* personnalisation d'un spoiler fermé */
background-color: #0F0F0F;
border-left: 3px solid #576780;
-moz-border-radius: 10px;
border-radius: 10px;
}
u {
color: #0F0F0F;
font-family: georgia;
text-decoration: none!important;
}
i {
color: #3F4B5E;
font-family: georgia;
}
.taillepa {
font-size: 11px;
}
tr.post td { /* lister automatiquement tous les messages */
padding-left: 20px;
padding-right: 20px;
padding-top: 5px;
padding-bottom: 0px;
}
.postbody, td.row1 span.gensmall { /* justifier les posts */
text-align: justify !important;
font-size: 11px;
}
.opacitypa { /* opacité restante sur une img */
filter:alpha(opacity=30);
-moz-opacity:0.7;opacity: 0.7;
}
.opacitypa img { /* opacité restante sur une image */
filter:alpha(opacity=30);
-moz-opacity:0.8;opacity: 0.8;
border: 2px solid #576780;
-moz-border-radius: 7px;
border-radius: 7px;
}
a {
text-decoration:none;
}
a:link {text-decoration: none;}
a:hover{text-decoration: none !important;}
a:active
{
text-decoration: none;
}
a:hover { /* enlever les soulignements des liens */
text-decoration: none !important;
}
.postdetails.poster-profile a img {
-moz-border-radius-bottomleft:0px;
-moz-border-radius-bottomright:0px;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
border-radius-bottomleft:0px;
border-radius-bottomright:0px;
border-radius-topleft:15px;
border-radius-topright:15px;
}
.postdetails.poster-profile a img {
-moz-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
border: 2px solid #3F4B5E;
padding: 2px;
}
.postdetails.poster-profile a img:hover {
-moz-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
border: 2px dotted #576780;
padding: 2px;
}
function ejs_nodroit() { alert('Le clic droit est interdit !!!'); return(false); } document.oncontextmenu = ejs_nodroit;
.postdetails.poster-profile a img {
margin: auto;
display: block;
margin-bottom: -10px;
}
.forumlink br{ /* supprimer l'espace entre le titre et la description des catégories */
display:none;
}
.bodyline > table br{ /*supprimer l'espace entre la bannière */
display:none;
}
textarea, .textarea.post, input.post { /* arrondir les coins zones */
-moz-border-radius:10px;
border-radius:10px;
-webkit-border-radius: 10px;
}
table.bodylinewidth { /* supprimer la marge (?) en haut du forum */
position: relative;
top: 0px;
}
.postdetails img { /* redimension automatique de la taille des avatars */
max-width: 200px;
max-height: 300px;
}
.opacity img {
filter:alpha(opacity=50);
-moz-opacity:0.5;opacity: 0.5;
}
.opacity img:hover {
filter:alpha(opacity=100);
-moz-opacity:1;opacity: 1;
}
.cadre {
border: 1px #292929 solid;
}
.cadre:hover {
border: 1px #3F4B5E solid;
}
.titre1 {
color:#3F4B5E;
}
.titre2 {
color:#3F4B5E;
}
.quotetitle {
text-align: center;
}
.wrote { /* personnaliser le survol d'un mot */
display:block;
font-family: arial;
letter-spacing: -1px;
color:#3F4B5E;
}
wrote:hover {
display:block;
font-family: arial;
letter-spacing: -1px;
color:#0F0F0F;
}
*.info .bulle {
position : absolute;
top : -2000em;
left : -2000px;
overflow : hidden;
cursor: crosshair; /* Forme de la souris */
background : #F6F6F6; /* Définition du fond, sinon on a le même que notre lien */
border:2px solid; /* Définition des bordures */
font-size : 10px; /* Taille de la police */
}
.info {
position: relative; /* Correction pour maximiser la compatibilité */
color : #A8E0AD; /* Couleur de notre lien */
top: 0px;
left: 0px;
text-decoration : none; /* Aucun soulignement du texte */
padding : 0px; /*Définition des marges intérieures de notre lien */
/* Définition de l'arrière plan de notre lien */
background : transparent url('comment.gif') no-repeat right center;
}
.info:hover .bulle, .info:focus .bulle, .info:active .bulle {
top:-34px;
left: 0px;
width : 70px;
height : 42px;
overflow : visible;
color: #576780;
font-family: georgia;
font-style: normal;
padding: 0px;
-moz-border-radius: 5px;
border-radius: 5px;
BORDER-top: 1px solid black;
border-bottom: 1px solid black;
border-RIGHT: 2px solid #3F4B5E;
border-left: 2px solid #3F4B5E;
background-color:#;
background: url('http://i44.servimg.com/u/f44/16/54/90/90/fondfo11.png');
z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
position: absolute;
}
.info:hover {
border : 0;
top: 0px;
left: 0px;
}
.cadre1 {
-moz-border-radius: 7px;
border-radius: 7px;
-webkit-border-radius: 7px;
border: 2px solid none;
font-size: 11px
}
.caté { /* FOND CATéGORIE TITRE */
font-family: georgia;
font-size: 20px;
letter-spacing: -2px;
}
.titreforum { /* TITRE CATEGORIE */
text-shadow: 0px 1px 2px #FFFFFF;
color: #0F0F0F;
}
ul#bouton {
position: fixed; /* On fixe la position des boutons */
margin: 0px; /* marge extérieure */
padding: 0px; /* marge intérieure */
top: 80px; /* positionné à 50px du haut */
left: 0px; /* positionné à 0px du bord gauche */
list-style: none; /* pas de style pour la liste */
z-index: 999; /* place les boutons au dessus de tout le reste */
}
ul#bouton li {
width: 30px; /* largeur du bouton */
margin-bottom: 4px; /* marge inférieure */
}
ul#bouton li a {
display: block; /* défini en bloc */
margin-left: -75px; /* marge extérieure négative gauche */
width: 90px; /* largeur */
height: 70px; /* hauteur */
background-color:#b8b8b8; /* couleur de fond */
background-repeat:no-repeat; /* répétition du fond */
background-position:center center; /* position du fond */
-moz-border-radius:0px 9px 9px 0px; /* angles arrondis */
-webkit-border-radius:0px 9px 9px 0px; /* angles arrondis */
border-radius:0px 9px 9px 0px; /* angles arrondis */
border:1px solid #b8b8b8; /* bordure */
-moz-box-shadow: 0px 0px 5px #000; /* ombre portée */
-webkit-box-shadow: 0px 0px 5px #000; /* ombre portée */
box-shadow: 0px 0px 5px #000; /* ombre portée */
opacity: 0.7; /* opacité */
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=60); /* opacité pour IE */
}
ul#bouton .galerie a{
background-image: url(http://i41.servimg.com/u/f41/16/11/46/37/note15.png);
}
ul#bouton .discut a{
background-image: url(http://i41.servimg.com/u/f41/16/11/46/37/book212.png);
}
ul#bouton .codes a{
background-image: url(http://i41.servimg.com/u/f41/16/11/46/37/meteo10.png);
}
#i_logo {
margin-top: -10px;
margin-bottom: -10px;
margin-right: -10px;
margin-left: -10px;
}
Pour le javascript, voici le code :
- Spoiler:
- Code:
$('document').ready(function()
{
$('#conteneur_onglets').css( 'display' , 'block' );
$('#conteneur_onglets .onglet').click(function()
{
change_categorie( $('.onglet', '#conteneur_onglets').index( this ) )
});
$('.onglet:eq(0)').click();
});
function change_categorie( index )
{
if( $('.categorie:eq(' + index + ')').size() != 0 )
{
$('#conteneur_categories').css( 'height' , $('.categorie:eq(' + index + ')').outerHeight() );
$('.categorie').css( 'display' , 'none' );
$('.categorie:eq(' + index + ')').fadeIn( 500 );
$('.onglet.actif').removeClass('actif');
$('.onglet:eq('+ index +')').addClass('actif');
}
else alert('Vous ne pouvez pas accÈder ‡ cette catÈgorie');
}
Merci bien =)
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Re: Onglets catégories à gauche
par Vost Lun 6 Aoû 2012 - 19:07
J'étais tombé sur un tuto par là, je vais essayer de te le trouver.
Vost- Nouveau membre
- Messages : 21
Inscrit(e) le : 01/08/2012 -
Re: Onglets catégories à gauche
par Rikku-Chan Lun 6 Aoû 2012 - 19:08
Merci beaucoup mais moi le soucis c'est que mon index box est beaucoup modifié =/
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Re: Onglets catégories à gauche
par Vost Lun 6 Aoû 2012 - 19:15
Ha ok, je laisse tombé alors, bonne chance à toi !
Vost- Nouveau membre
- Messages : 21
Inscrit(e) le : 01/08/2012 -
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Re: Onglets catégories à gauche
par Vost Lun 6 Aoû 2012 - 19:25
Oups ^^
Dernière édition par Vost le Lun 6 Aoû 2012 - 19:29, édité 1 fois
Vost- Nouveau membre
- Messages : 21
Inscrit(e) le : 01/08/2012 -
Re: Onglets catégories à gauche
par Rikku-Chan Lun 6 Aoû 2012 - 19:28
Euh... Si un admin passais par là il te dirais que c'est pas bien ce que tu fais je pense =O
Tu ne dois pas faire de la pub de ton problème sur un autre problème. Puis moi je ne suis pas super codeuse non plus u.u
Tu viens de poster ton problème aujourd'hui seulement, patiente que quelqu'un vienne t'aider =)
Tu ne dois pas faire de la pub de ton problème sur un autre problème. Puis moi je ne suis pas super codeuse non plus u.u
Tu viens de poster ton problème aujourd'hui seulement, patiente que quelqu'un vienne t'aider =)
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Re: Onglets catégories à gauche
par Vost Lun 6 Aoû 2012 - 19:30
Ha oui c'est vrai 
J'ai édité du coup !
J'ai édité du coup !
Vost- Nouveau membre
- Messages : 21
Inscrit(e) le : 01/08/2012 -
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Re: Onglets catégories à gauche
par Vost Lun 6 Aoû 2012 - 19:33
Bonne chance, très bon forum au passage !
Vost- Nouveau membre
- Messages : 21
Inscrit(e) le : 01/08/2012 -
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Re: Onglets catégories à gauche
par PandaP Lun 6 Aoû 2012 - 20:38
Coucou voici donc:
Je tu rajoutes ceci dans le css:
voilà j'espère que cela te vas :3
Je tu rajoutes ceci dans le css:
- Code:
#conteneur_onglets
{
display: none;
margin-left: -130px;
position: hériter ;
}
voilà j'espère que cela te vas :3
PandaP- *
- Messages : 39
Inscrit(e) le : 10/06/2012
Re: Onglets catégories à gauche
par Rikku-Chan Lun 6 Aoû 2012 - 20:50
Coucou, alors alors, c'est presque ça =D
Voici ce que j'obtiens : https://i.servimg.com/u/f31/14/11/46/51/za_tif10.jpg
Et moi à la base j'ai ceci : http://apple-test.forumsactifs.com/?tt=1
Comme vous pouvez voir, il y a l'encadrement en ombre des catégories qui s'est enlevé =O
Vous avez peut être enlevé cette partie là :
Il ne faut pas l'enlever car sinon vous enlever l'encadrement de mes catégories =D
Merci bien ^^
Voici ce que j'obtiens : https://i.servimg.com/u/f31/14/11/46/51/za_tif10.jpg
Et moi à la base j'ai ceci : http://apple-test.forumsactifs.com/?tt=1
Comme vous pouvez voir, il y a l'encadrement en ombre des catégories qui s'est enlevé =O
Vous avez peut être enlevé cette partie là :
- Code:
<div class="contenucat"><div style="margin-left:15px;"><table class="forumline" width="750px" border="0" cellspacing="1" cellpadding="0">
Il ne faut pas l'enlever car sinon vous enlever l'encadrement de mes catégories =D
Merci bien ^^
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Re: Onglets catégories à gauche
par PandaP Lun 6 Aoû 2012 - 21:31
Non je ne l'ai pas enlevé, j'ai pris le premier template en fait ^^et le code n'y était pas
PandaP- *
- Messages : 39
Inscrit(e) le : 10/06/2012
Re: Onglets catégories à gauche
par Rikku-Chan Lun 6 Aoû 2012 - 23:58
Ah mince =O
Je t'avais donné le nouveau template par la suite =)
Pourrai-tu me dire qu'est ce que je dois changer pur avoir aussi l'encadrement ? =D
Merci =)
Je t'avais donné le nouveau template par la suite =)
Pourrai-tu me dire qu'est ce que je dois changer pur avoir aussi l'encadrement ? =D
Merci =)
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Re: Onglets catégories à gauche
par PandaP Mar 7 Aoû 2012 - 10:33
coucou
cherches ça:
(si c'est fini n'oubli pas de dire merci ; ))
cherches ça:
- Code:
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
(si c'est fini n'oubli pas de dire merci ; ))
PandaP- *
- Messages : 39
Inscrit(e) le : 10/06/2012
Re: Onglets catégories à gauche
par Rikku-Chan Mar 7 Aoû 2012 - 15:24
Coucou =D
Ca marche pas =O
Ca fais un gros bug dans mes catégories =O
Voilà ce que j'ai mis :
merci bien =)
ps : prend le bon template avec le fameux code s'il te plait ^^
J'ai essayé mais j'arrive pas =/
Ca marche pas =O
Ca fais un gros bug dans mes catégories =O
Voilà ce que j'ai mis :
- Spoiler:
- Code:
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<tr>
<td valign="bottom">
<!-- BEGIN switch_user_logged_in -->
<span class="gensmall">{LAST_VISIT_DATE}
{CURRENT_TIME}
</span>
<!-- END switch_user_logged_in -->
<div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
</td>
<td class="gensmall" align="right" valign="bottom">
<!-- BEGIN switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
<a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
<!-- END switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
</td>
</tr>
</table> <table><tr><td>
<div id="conteneur_onglets">
<div class="onglet"><img src="http://i41.servimg.com/u/f41/16/11/46/37/incipi11.png" /></div>
<div class="onglet"><img src="http://i41.servimg.com/u/f41/14/11/46/51/contin10.png" /></div>
<div class="onglet"><img src="http://i41.servimg.com/u/f41/16/11/46/37/midgar12.png" /></div>
<div class="onglet"><img src="http://i41.servimg.com/u/f41/16/11/46/37/contin11.png" /></div>
<div class="onglet"><img src="http://i41.servimg.com/u/f41/16/11/46/37/contin14.png" /></div>
<div class="onglet"><img src="http://i41.servimg.com/u/f41/16/11/46/37/iles_d12.png" /></div>
<div class="onglet"><img src="http://i41.servimg.com/u/f41/16/11/46/37/excipi11.png" /></div>
</div></td><td>
<div id="conteneur_categories">
<!-- BEGIN catrow --><!-- BEGIN tablehead -->
<div class="categorie">
<div class="haut2"></div>
<div class="contenucat"><div style="margin-left:15px;"><table class="forumline" width="750px" border="0" cellspacing="1" cellpadding="0">
<tr>
<th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
<th nowrap="nowrap" width="150"><div style="width:150px;"></div></th>
</tr>
<!-- END tablehead -->
<!-- BEGIN cathead -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
<!-- END inc -->
<td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
<h{catrow.cathead.LEVEL} class="hierarchy">
<span class="cattitle">
<a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
</span>
</h{catrow.cathead.LEVEL}>
</td>
<td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
</tr>
<!-- END cathead -->
<!-- BEGIN forumrow -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
<!-- END inc -->
<td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle"><br />
<img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
</td>
<td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
<table width="100%"><tbody><tr><td><h{catrow.forumrow.LEVEL} class="hierarchy">
<span class="forumlink">
<a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
</span>
</h{catrow.forumrow.LEVEL}></td></tr></tbody></table>
<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
<span class="gensmall">
<!-- BEGIN switch_moderators_links -->
{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
<!-- END switch_moderators_links -->
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
</span>
</td>
<td class="row3 over" align="center" valign="middle" height="50"><br />
<div class="cadre1">{catrow.forumrow.POSTS} messages • {catrow.forumrow.TOPICS} sujets<br />
<span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
</td>
</tr>
<!-- END forumrow -->
<!-- BEGIN catfoot -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
<!-- END inc -->
<td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
</tr>
<!-- END catfoot -->
<!-- BEGIN tablefoot -->
</table><div class="bas2"></div><img src="{SPACER}" alt="" height="5" width="1" /></div>
<!-- END catrow --><!-- END tablefoot -->
</div></td></tr></table>
merci bien =)
ps : prend le bon template avec le fameux code s'il te plait ^^
J'ai essayé mais j'arrive pas =/
Rikku-Chan- ***
-
Messages : 164
Inscrit(e) le : 17/01/2011 -
Page 1 sur 2 • 1, 2
Sujets similaires» catégories en onglets + onglets sur la droite
» (Catégories par onglets) Titres de catégories en image.
» Catégories en onglets
» Tableau des onglets à droit avec image à gauche...
» Tableau à onglet à gauche : Comment mettre une image sous les onglets ?
» (Catégories par onglets) Titres de catégories en image.
» Catégories en onglets
» Tableau des onglets à droit avec image à gauche...
» Tableau à onglet à gauche : Comment mettre une image sous les onglets ?
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 2
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum