Mettre ses catégories en onglets

Page 3 sur 3 Précédent  1, 2, 3

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

Résolu Mettre ses catégories en onglets

Message par CryingToYourHeart le Mar 20 Mar 2012 - 20:43

Rappel du premier message :

Bonjour,


J'aimerais pouvoir faire en sorte que mes catégories soient en onglets, j'ai suivis un tuto qui est très bien et qui marche, le seul problème c'est que je ne peux pas mettre les modifications déjà apportées précédemment à la nouvelle, ou du moins je ne vois pas où la mettre. J'ai utilisé ce tutoriel: http://forum.forumactif.com/t324077-categories-en-onglets?highlight=cat%E9gories+onglets

Je vous mets ci dessous mon template:
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}<br />
        </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>
<!-- BEGIN catrow --><!-- BEGIN tablehead --><table class="fondcat" width="100%" border="0" cellspacing="0" cellpadding="0">

<img src="http://img11.hostingpics.net/pics/238426Sanstitre1.png" alt="" height="200px" width="846px" /><br>

      <th colspan="3" nowrap="nowrap" width="100%"> {catrow.tablehead.L_FORUM} </th>
  <!-- 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 colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
        <div class="cadcol"><h{catrow.forumrow.LEVEL} class="hierarchy">
            <span class="forumlink">
              <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br />
            </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 -->
         
                          </span></div>
      </td>
          <td align="center" valign="top" height="50">
            <div style="width:150px";>
            <div class="cadcol" id="subforums"><span class="genmed">Navigation</span><br />{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}<script type="text/javascript">jQuery('#subforums').html(jQuery('#subforums').html().replace(/, /g,'<br />')).removeAttr('id');</script></div>
            </div>
            </td>
      <td align="center" valign="top" height="50">
                  <div style="width:150px;">
                  <div class="cadcol">
                    <span class="gensmall">{catrow.forumrow.TOPICS}sujets et {catrow.forumrow.POSTS} messages <br /><br />
                      {catrow.forumrow.LAST_POST}</span><br /><br />
                  </div>
                  <div style="margin-top:-40px;" align="center">
        <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
                    </div><br /></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><img src="{SPACER}" alt="" height="5" width="1" /><img src="http://img11.hostingpics.net/pics/838052Sanstitre2.png" alt="" height="200px" width="848px" /><br><!-- END tablefoot --><!-- END catrow -->

Merci à ceux qui voudront bien m'aider, j'espère avoir été assez clair dans mes explications au quel cas je vous expliquerais à nouveau Smile


Dernière édition par CryingToYourHeart le Ven 18 Mai 2012 - 23:52, édité 4 fois

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre ses catégories en onglets

Message par Invité le Ven 18 Mai 2012 - 22:29

::fete:: J'ai réussi à créee un soucis similaire! Vérifiez que vous n'avez pas le code javascript pour les catégories en double dans votre liste Wink . ça m'a fait un bug équivalent lorsque je l'ai installé une seconde fois au lieu de l'éditer.

Bien sincèrement.

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre ses catégories en onglets

Message par CryingToYourHeart le Ven 18 Mai 2012 - 22:44

Bonsoir, j'ai réussi à ce qu'il n'y soit qu'une seule fois mais le code s'affiche et enlève ma PA :s
voyez ici: http://thewerewolfpack.forumgratuit.org/

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre ses catégories en onglets

Message par Invité le Ven 18 Mai 2012 - 22:47

Supprimez complètement le javascript des catégories et créez-en un nouveau avec ce code:
Code:
$(function(){
 
  var t;
 
  /* liste des onglets avec les catégories en faisant partie*/
  var onglets=  [
                          ["TEST",[0]],
                          ["Administration",[1]],
                          ["Les loups",[2]],
                          ["Others",[3]]];
 
  var getOnglet= function(s) {
      var j;
      for(j=0;j<onglets.length;j++)
        if(JSON.stringify(onglets[j])==s) return onglets[j];
      return !1;
  };
 
 
  var inOnglets= function(d,i) {
      var j;
      for(j=0;j<d[1].length;j++)
        if(d[1][j]==i) return !0;
      return !1;
  };
 
  /* onglet sélectionné par défaut */
  var songlet= onglets[0];
  /* est-ce que l'onglet sélectionné est sauvegardé d'un affichage de l'index à l'autre */
  var save= true;
  /* temps pour slider en ms */
  var timeslide= 500;
 
  /* récupération de l'onglet sauvé d'une autre fois */
  if(save && window.localStorage)
      if(t=localStorage.getItem("onglets"))
        if(t=getOnglet(t))
            songlet= t;
 
  /* entoure les catégories d'un <div class="cat-table" /> */
  $("td.fondcat").closest("table").wrap('<div class="cat-table" />');
 
  /* affichage de l'onglet en cours */
  $(".cat-table").filter(function(index) {
    return !inOnglets(songlet,index);
  }).hide();
 
  /* ajout du div des onglets */
  $(".cat-table:first").before('<div id="cat-onglets"></div>');
 
  /* ajout des onglets dans le div */
  for(t=0;t<onglets.length;t++)
  {
      $("#cat-onglets").append('<div class="co-item'+(onglets[t]==songlet?' co-actif':'')+'">'+onglets[t][0]+'</div>');
  }
 
  /* clic sur un onglet */
  $("#cat-onglets .co-item").click(function(){
      $("#cat-onglets .co-actif").removeClass("co-actif");
      $(this).addClass("co-actif");
      var o= onglets[$("#cat-onglets .co-item").index(this)];
      $(".cat-table").not($(".cat-table").filter(function(index) {
        return inOnglets(o,index);
      }).slideDown(timeslide)).slideUp(timeslide);
      if(save && window.localStorage) localStorage.setItem("onglets",JSON.stringify(o));
  });
 
});
On va bien finir par le faire fonctionner à force d'entêtement Razz.

Bien sincèrement.

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre ses catégories en onglets

Message par CryingToYourHeart le Ven 18 Mai 2012 - 22:55

Merci beaucoup de m'aider, je viens de le faire mais ça ne marche pas :s

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Page 3 sur 3 Précédent  1, 2, 3

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