Vérifiez vos informations

Il semblerait que les informations techniques de votre profil n'aient pas été actualisées depuis un certain temps... Pour que l'aide apportée vous soit efficace, il est important que ces informations soient à jour : prenez quelques secondes pour confirmer ou compléter les informations suivantes.


Lien de votre forum
Version de ce forum
Vous êtes le fondateur de ce forum
Vous avez modifié le CSS de ce forum
Vous avez modifié les templates de ce forum
Votre navigateur

Catégories en onglets

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Catégories en onglets

Message par Luna-C le Dim 28 Aoû 2011 - 16:10

Bonsoir =)

Alors voila mon soucis j'aimerais que les catégories de mon forum (cf exemple bienvenue organisation ... ) se présente comme sur le forum donner en exemple, cad en onglet survolé.
http://www.berkeley-u.com/

J'ai lu les sujets posté sur le forum je n'ai pas trouvé le code, j'ai essayé avec le générateur :
http://shared-development.clanteam.com/onglets.php

Voila le résultat obtenu :
http://i51.tinypic.com/71sk8z.png

Il faut dire que j'ai touché aux templates suivantes auparavant :

index_body
index_box
overall_footer
overall_header
viewtopic_body

Voila mon css
Code:
.navtop {
top : 0px;
width : 100% ;
background-color : # ;
border-bottom : 0px STYLE #FFA34F
}

.mainmenu img { display: none; }


/* BORDURE FORUM */
.forumline{
    background-color: #4B1414;
        -moz-border-radius:1px;
        border-bottom: 1px #4B1414 solid;
    }


input,textarea, select {
border-radius: 9px 9px;
-moz-border-radius: 9px;}

.postbody {
    display: block;
    text-align:justify;
}

.postbody {
display: block;
padding-left: 15px;
padding-right: 15px;
text-align:justify;
}

.quote{
font-family: Arial;
font-size: 11px;
color: #000000;
background-color: #FFFFFF;
border: #AD8E88;
border-style: solid ;
border-left-width: 6px;
border-top-width: 0px;
border-right-width: 0px;
}

.code{
font-family: Arial;
font-size: 11px;
color: #000000;
background-color: #FFFFFF;
border: #AD8E88;
border-style: solid ;
border-left-width: 6px;
border-top-width: 0px;
border-right-width: 0px;
}


.spoiler{
font-family: Arial;
font-size: 11px;
color: #000000;
background-color: #FFFFFF;
border: #AD8E88;
border-style: solid ;
border-left-width: 6px;
border-top-width: 0px;
border-right-width: 0px;
}

i {color :#D49161;}
b {color :#B39DA4;}
u {color: #651111;border-bottom: 1px dashed #651111;}
u {text-decoration: none;}



.quote, .code, .spoiler {
-moz-border-radius: 9px;}

tr.post span.gensmall { display: none; }
body { background-repeat: no-repeat; background-position: top center; background-attachment: scroll }

a:hover {cursor:se-resize;}
a {font-variant: small-caps;}

tr.post span.gensmall { display: none; }


    .postprofile dd, .postprofile dt {text-align: center;}

body{
  cursor:crosshair;
}

a
{
text-decoration: none;
}
.bodylinewidth{
margin-left:18%;}



 
 


.quote { -moz-border-radius: 10px;}
.code { -moz-border-radius: 10px;}


a {
text-transform: lowercase ;
letter-spacing: 2px;}




.bodyline {-moz-border-radius:20px;}




.profilentour {
text-align:center;
padding:5px;
background-color:#913631;
-moz-border-radius:05px;
}


.postdetails.poster-profile a img {
margin: auto;
display: block;
margin-bottom: -10px;
}


.cate {
            border-bottom: 5px solid #DFC4C0 ;
}

/* BORDURE TEXTE Dans cette section se trouve ... */
.def {
background-color: #793937;
border-bottom: 2px solid #793937;
border-left: 2px solid #793937;
border-top: 2px solid #793937;
border-right: 2px solid #793937;
-moz-border-radius : 10px ;
}

a.imginfo {
  position: relative;
  color: #7d7d7d;
  text-decoration: none;
  border-bottom: 0px #7d7d7d solid; /
}

a.imginfo span {
  display: none;
}
a.imginfo:hover {
  background: none;
  z-index: 999;
  cursor: help;
}

textarea, .textarea.post, input.post {
-moz-border-radius:10px;
}

.vignettes
{-moz-border-radius:5px;
background-color: ivory;
padding-right:05px;
padding-left:05px;
padding-bottom: 2px;
padding-top:2px;
font-size: 09px;}

.vignettes
{-moz-border-radius:5px;
background-color: ivory;
padding-right:05px;
padding-left:05px;
padding-bottom: 2px;
padding-top:2px;
font-size: 09px;}


.barre
{border-bottom: 5px solid ivory;}


a.forumlink {
display:block;
text-align: center;
border-bottom: 4px double #FFFFFF;
}





.forumline {
width:97%;
-moz-border-radius:10px 10px 10px 10px;
border-radius:10px 10px 10px 10px;
padding:3px;
}






input.post, select { background-color : #F5F5BF; }
input.mainoption {background-color : #F5F5BF; font-weight : normal;}
input.liteoption {background-color : #F5F5BF;font-weight : normal;}

.vava:hover{ background-color: #F5F5BF;}
.profil_vava { background-color : #F5F5BF; }


.namecat {
background-image: url("http://img801.imageshack.us/img801/9338/barrecouleur.png");
padding-bottom:0px;
padding-top:5px;
padding-bottom:5px;
letter-spacing: 2px;
border-left : 1px solid #4B1414;
border-right : 1px solid #4B1414;
border-bottom : 0px solid #4B1414;
font-family: Georgia;
margin-left:60px;
margin-right:200px;
margin-top:-10px;
color: #B39A88;
margin-bottom:-20px;
border-top: 1px solid #4B1414;
border-radius: 60px 60px 0px 0px;;
-moz-border-radius-bottomleft:0px;
-moz-border-radius-topleft:60px;
-moz-border-radius-bottomright:0px;
-moz-border-radius-topright:60px;
}

.linf {
background-color:#913631;
display:block;
text-align:center;
margin-top:-13px;
border:2px solid #881F30;
border-top:0px solid #881F30;
margin-left:20px;
margin-right:100px;
font-family:georgia;
font-size:11px;
-moz-border-radius: 0px 0px 40px 40px;
border-radius: 0px 0px 40px 40px;
padding:5px;
}


.cata {
background-image: url("http://i52.tinypic.com/24me4v6.png");
border:1px solid #913631;
border-bottom:0px solid white;
margin-bottom:5px;
-moz-border-radius:20px 20px 3px 3px;
border-radius:20px 20px 3px 3px;
padding:3px;
width:160px;}

.catb {
background-image: url("http://i52.tinypic.com/24me4v6.png");
-moz-border-radius:3px 3px 20px 20px;
border-radius:3px 3px 20px 20px;
border:1px solid #913631;
border-top:0px solid white;
padding:3px;
width:160px;}

.categ {
background-color:#913631;
padding:10px;
-moz-border-radius:60px 0px 60px 0px;
border-radius:60px 0px 60px 0px;
margin:10px;
border:2px solid #881F30;}

.postbody {display: block; padding-left: 15px; padding-right: 15px; line-height:16px; text-align:justify; font-size:12px;}
tr.post span.gensmall {display : none;}

a.forumlink {
color:#A85F5C;
font-family:georgia;
font-size:18px;
font-weight: normal;
letter-spacing:-1px;
text-align:center;
font-family:18px;
display:block;
}

.forum-sousforum {
      color: #A85F5C;
      border: 3px solid #A85F5C;
      border-top: 0px !important;
      -moz-border-radius-bottomleft: 14px;
      -moz-border-radius-bottomright: 14px;
      -webkit-border-bottom-right-radius: 14px;
      -webkit-border-bottom-left-radius: 14px;
      border-bottom-right-radius: 14px;
      border-bottom-left-radius: 14px;
      margin: auto;
      padding: 4px;
      color: #A85F5C;
      width: 50%;
      text-align: center;
      height: 14px;
      font-size: 11px;
}



/* QEEL */

.onglet { background-color:#913631 ;
padding-right:4px;
text-transform:lowercase;
background-color: #913631;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
 font-family: georgia;
font-weight: bold; text-align: center;
color: #d49161;}
 


.message { background-color:#913631;
width: 450px !important;
 padding-top: 5px;
 padding-bottom: 5px;
padding-left: 10px;
 padding-right: 10px;
font-family: georgia;
text-align: center;
color: #913631;}


.message { background-color: #913631;
background-image : url('http://i51.tinypic.com/25ahifq.jpg') ;
background-repeat : repeat ;
 padding-top: 5px;
 padding-bottom: 5px;
padding-left: 10px;
 padding-right: 10px;
font-family: georgia;
text-align: center;
color: #913631;}

/* CSS INFOBULLE */

a.imginfo {
  position: relative;
  color: #B8A8A5;
  text-decoration: none;
  border-bottom: 1px #B8A8A5 solid; /* on souligne le texte */
}

a.imginfo span {
  display: none; /* on masque l'infobulle */
}
a.imginfo:hover {
  background: none; /* correction d'un bug IE */
  z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
  cursor: help; /* on change le curseur par défaut en curseur d'aide */
}
a.imginfo:hover span {
  display: inline; /* on affiche l'infobulle */
  position: absolute;
  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é */
  top: -100px; /* on positionne notre infobulle */
  left: 100px;
  width:450px; /*largeur de l'infobulle*/
  background: white;
  color: #B8A8A5;
  padding: 1px;
  border: 0px solid grey;
  border-left: 2px solid #CCBB9D;
  border-right: 3px solid #FFFFFF;
  border-top: 3px solid #FFFFFF;
  border-bottom: 2px solid #CCBB9D;
}


/* FICHES */

.fiche2 { font-style:normal ;color:#bd163b;letter-spacing:1px; text-shadow: #000000 1px 1px 2px;font-family: georgia; font-size: 32px; } /* TITRE DES FICHES */

.imghab {
opacity : 0.5 }

.imghab:hover{
opacity : 1 }

.pres1 {border: solid #592E28 05px; -moz-border-radius-topleft:40px; -moz-border-radius-topright:40px;width :435px;height:50px ;} /* NOM ET PRENOM CONTOUR */

et mon index box :
Code:
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
  <tr>
      <td class="gensmall" align="right" valign="bottom">
        <!-- BEGIN switch_user_logged_in -->
        <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a>

        <!-- END switch_user_logged_in -->
       
      </td>
  </tr>
</table>
<!-- BEGIN catrow --><!-- BEGIN cathead -->
<table width="100%">
    <tr>
      <th colspan="2" nowrap="nowrap" width="100%" class="secondarytitle">
          <div class="namecat"><h{catrow.cathead.LEVEL} class="hierarchy">{catrow.cathead.CAT_TITLE}</h{catrow.cathead.LEVEL}></div>
      </th>
  </tr>
</table><!-- END cathead -->
       
  <table class="forumline" width="100%" style="position: relative;" border="0" cellspacing="0" cellpadding="0">     
  <!-- BEGIN forumrow -->
  <tr>
  <!-- BEGIN inc -->
      <td class="{catrow.forumrow.inc.INC_CLASS}" width="15"><img src="{SPACER}" height="0" width="15" alt="." /></td>
      <!-- END inc --><td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
        <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="1" valign="top" width="100%" height="05"><div class="categ"><table width="100%"><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></table><table><tr><td width="100%">
        <span class="genmed"><div style="text-align:justify;">{catrow.forumrow.FORUM_DESC}</span>
      <!-- BEGIN switch_moderators_links --><!-- END switch_moderators_links --></td>
      <td><!-- BEGIN forum_link_no --><td align="center" valign="middle" height="05"><div class="cata"><span class="gensmall">{catrow.forumrow.TOPICS} sujets || {catrow.forumrow.POSTS} messages</span></div><div class="catb"><span class="gensmall">{catrow.forumrow.LAST_POST}</span></div></td><!-- END forum_link_no -->
      </tr></table></div><table width="100%"><tr><td><div class="linf">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
</div></td></tr></table></td></tr>
<!-- BEGIN forum_link -->
<!-- END forum_link --><!-- END forumrow -->

<!-- BEGIN catfoot -->
  <tr>
<!-- BEGIN inc -->
      <td class="{catrow.catfoot.inc.INC_CLASS}" width="15"><img src="{SPACER}" height="0" width="30" /></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 --></table>

  <!-- BEGIN tablefoot -->
<img src="{SPACER}" alt="" height="3" width="1" /><!-- END tablefoot --><!-- END catrow -->

L'adresse de mon forum pour voir comment j'avais déjà touché au catégorie, mais j'aimerais pouvoir garder a l'intérieur des onglets les forums présentés tels quels
http://new-york-i-loveyou.forumactif.org/

Merci d'avance et si je ne suis pas claire je me ré expliquerais sans problèmes !


Dernière édition par Luna-C le Dim 28 Aoû 2011 - 16:29, édité 1 fois
avatar

Luna-C
**

Messages : 54
Inscrit(e) le : 05/06/2009

http://new-york-i-loveyou.forumactif.org/forum.htm
Luna-C a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par SoraNoHime le Dim 28 Aoû 2011 - 16:13

Bonjour

aller dans PA > Affichage > Structure & Hiérarchie et mettez sur Moyen séparer les catégories de l'index.

Est-ce mieux ?

Cordialement.
avatar

SoraNoHime
Membre actif

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

http://fanasiacodes.bbfr.net/
SoraNoHime a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par Luna-C le Dim 28 Aoû 2011 - 21:08

c'est mieux merci, mais la présentation est spéciale :s

http://nyily-test.forumactif.org/forum
avatar

Luna-C
**

Messages : 54
Inscrit(e) le : 05/06/2009

http://new-york-i-loveyou.forumactif.org/forum.htm
Luna-C a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par SoraNoHime le Dim 28 Aoû 2011 - 21:44

Alors déjà il faut qu'une partie soit visible (mais pas forcément accessible ) aux invités dans chaque catégorie.

Ensuite vous pouvez personnaliser en adaptant dans la css le .actif pour l'onglet actif et le .onglet pour les autres à votre gout ^^
avatar

SoraNoHime
Membre actif

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

http://fanasiacodes.bbfr.net/
SoraNoHime a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par Luna-C le Dim 28 Aoû 2011 - 21:52

Alors j'ai modifié mon template :

Code:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>

<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>

         <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a>

         <!-- END switch_user_logged_in -->
         <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
      </td>
   </tr>
</table>

<table id="conteneur_onglets">
  <tr>
      <td OnMouseOver="change_categorie(1)">nom onglet 1</td>
      <td OnMouseOver="change_categorie(2)">nom onglet 2</td>
      <td OnMouseOver="change_categorie(3)">nom onglet 3</td>
      <td OnMouseOver="change_categorie(4)">nom onglet 4</td>
      <td OnMouseOver="change_categorie(5)">nom onglet 5</td>
<!--  <td OnMouseOver="change_categorie(Y)">nom onglet Y</td>  -->
  </tr>
</table>

<script type="text/javascript">

  function change_categorie(numero)
  {
      if($('.categorie:eq('+(numero-1)+')').size() != 0)
      {
        $('.categorie').css("display","none");
        $('#conteneur_onglets .actif').removeClass("actif");
       
        $('#conteneur_onglets td:eq('+(numero-1)+')').addClass("actif");
        $('.categorie:eq('+(numero-1)+')').fadeIn();
      }
      else
      {
        alert("Vous n'avez pas accès à cette catégorie")
      }
  } 

  $("document").ready(function()
  {
      if($(".categorie").size() > 1)
      {
        if($("#conteneur_onglets").is("table"))
        {
            $("#conteneur_onglets").css("display","table");
        }
        else
        {
            $("#conteneur_onglets").css("display","block");
        }
      }

      change_categorie(1);
  })
 
</script>

</div><!-- BEGIN catrow --><!-- BEGIN tablehead --><div class="categorie">
<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="50">{L_TOPICS}</th>
      <th nowrap="nowrap" width="50">{L_POSTS}</th>
      <th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</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">
         <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">
         <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}>
         <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" align="center" valign="middle" height="50">
         <span class="gensmall">{catrow.forumrow.TOPICS}</span>
      </td>
      <td class="row2" align="center" valign="middle" height="50">
         <span class="gensmall">{catrow.forumrow.POSTS}</span>
      </td>
      <td class="row3 over" align="center" valign="middle" height="50">
         <span class="gensmall">{catrow.forumrow.LAST_POST}</span>
      </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><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

Mais du coup je n'arrive pas a euh comment m'expliquer faire correspondre les catégories justement je pense que c'est peut être ce que vous voulez dire par " Alors déjà il faut qu'une partie soit visible (mais pas forcément accessible ) aux invités dans chaque catégorie. "

je suis déolé j'ai un peu de mal avec ce tuto/code
avatar

Luna-C
**

Messages : 54
Inscrit(e) le : 05/06/2009

http://new-york-i-loveyou.forumactif.org/forum.htm
Luna-C a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par SoraNoHime le Dim 28 Aoû 2011 - 22:06

Et en remplaçant le code de votre template :
Code:
<table id="conteneur_onglets">
  <tr>
      <td OnMouseOver="change_categorie(1)">nom onglet 1</td>
      <td OnMouseOver="change_categorie(2)">nom onglet 2</td>
      <td OnMouseOver="change_categorie(3)">nom onglet 3</td>
      <td OnMouseOver="change_categorie(4)">nom onglet 4</td>
      <td OnMouseOver="change_categorie(5)">nom onglet 5</td>
<!--  <td OnMouseOver="change_categorie(Y)">nom onglet Y</td>  -->
  </tr>
</table>
 
<script type="text/javascript">
 
  function change_categorie(numero)
  {
      if($('.categorie:eq('+(numero-1)+')').size() != 0)
      {
        $('.categorie').css("display","none");
        $('#conteneur_onglets .actif').removeClass("actif");
     
        $('#conteneur_onglets td:eq('+(numero-1)+')').addClass("actif");
        $('.categorie:eq('+(numero-1)+')').fadeIn();
      }
      else
      {
        alert("Vous n'avez pas accès à cette catégorie")
      }
  }
 
  $("document").ready(function()
  {
      if($(".categorie").size() > 1)
      {
        if($("#conteneur_onglets").is("table"))
        {
            $("#conteneur_onglets").css("display","table");
        }
        else
        {
            $("#conteneur_onglets").css("display","block");
        }
      }
 
      change_categorie(1);
  })
 
</script>
par celui d'origine du générateur ?
Code:
<!-- DEBUT MODIF ONGLETS -->

<script type="text/javascript">
<!--

document.write('<div align="center" style="display:none;" id="conteneur_barre_onglet">
<ul class="conteneur_onglets">

<li onMouseOver="change_cat(1)" class="onglet actif" id="onglet_1">onglet 1</li>
<li onMouseOver="change_cat(2)" class="onglet " id="onglet_2">onglet 2</li>
<li onMouseOver="change_cat(3)" class="onglet " id="onglet_3">onglet 3</li>
<li onMouseOver="change_cat(4)" class="onglet " id="onglet_4">onglet 4</li>
<li onMouseOver="change_cat(5)" class="onglet " id="onglet_5">onglet 5</li>
<li onMouseOver="change_cat(6)" class="onglet " id="onglet_6">onglet 6</li>

</ul></div>');

var compteur_cat = 1;

function change_cat(numero)
{
   if(document.getElementById('categorie_'+numero))
   {
      /* affichage de la bonne categorie */
      $('table[id^=categorie_]').css('display','none');
      $('table[id=categorie_'+numero+']').fadeIn();
      
      /* affichage du bon onglet */
      $('.actif').removeClass("actif");
      $('.onglet[id=onglet_'+numero+']').addClass("actif");
   }
}

function capture_cat()
{
   if(compteur_cat == 1)
   {
      document.write('<table class="forumline" id="categorie_' + compteur_cat + '" >');
   }
   else
   {
      $('#conteneur_barre_onglet').css("display","block");
      document.write('<table class="forumline" id="categorie_' + compteur_cat + '" style="display:none;">');
   }
   
   compteur_cat++;
}

//-->
</script>

<!-- BEGIN catrow --><!-- BEGIN tablehead -->

<script type="text/javascript">
<!--
   capture_cat();
//-->
</script>

<!-- FIN MODIF ONGLETS -->
avatar

SoraNoHime
Membre actif

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

http://fanasiacodes.bbfr.net/
SoraNoHime a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par Luna-C le Dim 28 Aoû 2011 - 22:13

cela m'indique " La balise a été fermée avant d'avoir été ouverte ou la balise n'a pas été ouverte. "
avatar

Luna-C
**

Messages : 54
Inscrit(e) le : 05/06/2009

http://new-york-i-loveyou.forumactif.org/forum.htm
Luna-C a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par SoraNoHime le Dim 28 Aoû 2011 - 22:14

Vous avez du faire une erreur en copiant collant. Rendez-moi votre template que je vérifie ^^
avatar

SoraNoHime
Membre actif

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

http://fanasiacodes.bbfr.net/
SoraNoHime a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par Luna-C le Dim 28 Aoû 2011 - 22:17

Code:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
 
<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>
 
        <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a>
 
        <!-- END switch_user_logged_in -->
        <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
      </td>
  </tr>
</table>
 
<!-- DEBUT MODIF ONGLETS -->
 
<script type="text/javascript">
<!--
 
document.write('<div align="center" style="display:none;" id="conteneur_barre_onglet">
<ul class="conteneur_onglets">
 
<li onMouseOver="change_cat(1)" class="onglet actif" id="onglet_1">onglet 1</li>
<li onMouseOver="change_cat(2)" class="onglet " id="onglet_2">onglet 2</li>
<li onMouseOver="change_cat(3)" class="onglet " id="onglet_3">onglet 3</li>
<li onMouseOver="change_cat(4)" class="onglet " id="onglet_4">onglet 4</li>
<li onMouseOver="change_cat(5)" class="onglet " id="onglet_5">onglet 5</li>
<li onMouseOver="change_cat(6)" class="onglet " id="onglet_6">onglet 6</li>
 
</ul></div>');
 
var compteur_cat = 1;
 
function change_cat(numero)
{
  if(document.getElementById('categorie_'+numero))
  {
      /* affichage de la bonne categorie */
      $('table[id^=categorie_]').css('display','none');
      $('table[id=categorie_'+numero+']').fadeIn();
     
      /* affichage du bon onglet */
      $('.actif').removeClass("actif");
      $('.onglet[id=onglet_'+numero+']').addClass("actif");
  }
}
 
function capture_cat()
{
  if(compteur_cat == 1)
  {
      document.write('<table class="forumline" id="categorie_' + compteur_cat + '" >');
  }
  else
  {
      $('#conteneur_barre_onglet').css("display","block");
      document.write('<table class="forumline" id="categorie_' + compteur_cat + '" style="display:none;">');
  }
 
  compteur_cat++;
}
 
//-->
</script>
 
<!-- BEGIN catrow --><!-- BEGIN tablehead -->
 
<script type="text/javascript">
<!--
  capture_cat();
//-->
</script>
 
<!-- FIN MODIF ONGLETS -->
 
</div><!-- BEGIN catrow --><!-- BEGIN tablehead --><div class="categorie">
<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="50">{L_TOPICS}</th>
      <th nowrap="nowrap" width="50">{L_POSTS}</th>
      <th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</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">
        <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">
        <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}>
        <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" align="center" valign="middle" height="50">
        <span class="gensmall">{catrow.forumrow.TOPICS}</span>
      </td>
      <td class="row2" align="center" valign="middle" height="50">
        <span class="gensmall">{catrow.forumrow.POSTS}</span>
      </td>
      <td class="row3 over" align="center" valign="middle" height="50">
        <span class="gensmall">{catrow.forumrow.LAST_POST}</span>
      </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><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

voila merci de votre patience Very Happy
avatar

Luna-C
**

Messages : 54
Inscrit(e) le : 05/06/2009

http://new-york-i-loveyou.forumactif.org/forum.htm
Luna-C a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par SoraNoHime le Dim 28 Aoû 2011 - 22:27

Code:
   
        </div><!-- BEGIN catrow --><!-- BEGIN tablehead --><div class="categorie">
        <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">

supprimez cette partie de votre template ^^
avatar

SoraNoHime
Membre actif

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

http://fanasiacodes.bbfr.net/
SoraNoHime a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par Luna-C le Dim 28 Aoû 2011 - 22:36

C'est mieux merci Very Happy
Mais avec ce code je n'arrive pas a présenter mes onglets les uns a coté des autres comme dans le modéle forum berkley
avatar

Luna-C
**

Messages : 54
Inscrit(e) le : 05/06/2009

http://new-york-i-loveyou.forumactif.org/forum.htm
Luna-C a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par SoraNoHime le Dim 28 Aoû 2011 - 22:39

Il vous suffit de personnaliser la css : dans
Code:
.onglet { background-color:#913631 ;
padding-right:4px;
text-transform:lowercase;
background-color: #913631;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
 font-family: georgia;
font-weight: bold; text-align: center;
color: #d49161;}

ajoutez: display:inline-block; avant }

et personnaliser l'onglet actif avec
.actif {
vos propriétés
}
avatar

SoraNoHime
Membre actif

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

http://fanasiacodes.bbfr.net/
SoraNoHime a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par Luna-C le Dim 28 Aoû 2011 - 23:06

je suis vraiment nulle mais je ne sais pas du tout personnaliser
avatar

Luna-C
**

Messages : 54
Inscrit(e) le : 05/06/2009

http://new-york-i-loveyou.forumactif.org/forum.htm
Luna-C a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par SoraNoHime le Dim 28 Aoû 2011 - 23:09

Je vous invite à parcourir ceci : CSS et propriétés

Wink vous y trouverez comment faire vos personnalisation à l'intérieur des codes que je vous ai donné.

Cordialement.
avatar

SoraNoHime
Membre actif

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

http://fanasiacodes.bbfr.net/
SoraNoHime a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par Luna-C le Dim 28 Aoû 2011 - 23:13

Merci beaucoup pour votre aide =D
avatar

Luna-C
**

Messages : 54
Inscrit(e) le : 05/06/2009

http://new-york-i-loveyou.forumactif.org/forum.htm
Luna-C a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Catégories en onglets

Message par SoraNoHime le Lun 29 Aoû 2011 - 2:32

Bonjour,

Afin de faciliter la gestion des problèmes, si votre problème est résolu, pensez à :
  • éditer votre premier message,
  • cocher l'icône résolu
  • Et enregistrer en cliquant sur


Vous pouvez également remercier les personnes qui vous ont aidé, en cliquant sur le bouton

A bientôt sur ForumActif Smile
avatar

SoraNoHime
Membre actif

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

http://fanasiacodes.bbfr.net/
SoraNoHime a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum