Script de catégories en onglets

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

Résolu Script de catégories en onglets

Message par MlleSnake le Lun 2 Mai 2016 - 2:38

Détails techniques


Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox, Google Chrome, Internet Explorer
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://monster-hunter.forumactif.com/

Description du problème

Coucou !

Alors alors, j'ai installé un système d'onglets sur mon forum en construction et il y a un petit truc qui me dérange beaucoup, c'est que quand je clique pour changer de catégorie, ça ramène directement en haut de la page(il faut évidemment avoir «scrolldown» pour s'en apercevoir..) et bah j'aimerais que la page ne bouge pas, que les catégories changent avec fluidité, voilà. C'est probablement juste un truc dans mon script, mais je connais nada en js... =/
edit : je viens de remarquer un autre truc, le titre de la catégorie serait supposé apparaître avant le nom des forums, mais ils n'apparaissent pas '-'

le js:
Code:
$('document').ready(function()
 {
  if($('.categorievo').size() > 1)
    {
 $('#conteneur_ongletsvo').css( 'display' , 'block' );
 $('#conteneur_ongletsvo .ongletvo').click(function()
 {
 change_categorie( $('.ongletvo', '#conteneur_ongletsvo').index( this ) )
 });
 
 $('.ongletvo:eq(0)').click();
}
 });

 function change_categorie( index )
 {
 if( $('.categorievo:eq(' + index + ')').size() != 0 )
 {

 $('.categorievo').css( 'display' , 'none' );
 $('.categorievo:eq(' + index + ')').fadeIn( 600 );
 
 $('.ongletvo.actif').removeClass('actif');
 $('.ongletvo:eq('+ index +')').addClass('actif');
 }
 else alert('Vous ne pouvez pas accéder à cette catégorie');
 }

le template:
Code:
 <div id="conteneur_ongletsvo">
 <table><tr>
 <td class="ongletvo"><div>Nom onglet 1</div></td>
 <td class="ongletvo"><div>Nom onglet 2</div></td>
 <td class="ongletvo"><div>Nom onglet 3</div></td>
 <td class="ongletvo"><div>Nom onglet 4</div></td>
 <td class="ongletvo"><div>Nom onglet 5</div></td>
 </tr></table>
 </div>

<div id="conteneur_categoriesvo">
<!-- BEGIN catrow -->

<!-- BEGIN tablehead --><div class="categorievo">
<!-- END tablehead -->
<!-- BEGIN cathead -->
 
      <h1 class="titre_cat">{catrow.cathead.CAT_TITLE}</h1>
      <!-- END cathead -->
      <!-- BEGIN forumrow -->
    <table style="margin:auto" cellspacing="10px">
        <tbody>
          <tr>
            <td>
              <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" class="folder_img"/>
            </td>
            <td>
              <h2 class="titre_forum"><a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></h2>
              <div class="sous_forums">
                <div class="retvirg">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div>
<script type="text/javascript">$('.retvirg').each(function(){$(this).html($(this).html().replace(/>, /g,"><br /> "));});</script>
              </div>
              <div class="description_forum">{catrow.forumrow.FORUM_DESC}</div>
              <div style="clear:both;margin-bottom:10px"></div>
            </td>
            <td><div class="blocimg_descri">image</div><div class="stats_forum">
              <span class="gensmall"><div id="last_post">{catrow.forumrow.LAST_POST}</div></span>
              <span class="gensmall"><div id="post_topics">{catrow.forumrow.POSTS} messages  ▲  {catrow.forumrow.TOPICS} sujets</div></span>
              </div>
            </td>
          </tr>
        </tbody>
      </table>
      <!-- END forumrow -->
      <!-- BEGIN catfoot -->
 
  <!-- END catfoot -->
<!-- BEGIN tablefoot -->

</div><!-- END tablefoot -->
  <!-- END catrow --></div>

la partie css:
Code:
/*Conteneur qui contient toutes les catégories */
#conteneur_categoriesvo {
}
/* Conteneur de chaque catégorie */
 .categorievo {
}
/* Conteneur de tous les onglets */
#conteneur_ongletsvo {
  display: none;
}
/* Un onglet */
.ongletvo{
  cursor: pointer;
}
/* Onglet actif */
.actif{
  color: darkred;
}

Merci d'avance !


Dernière édition par MlleSnake le Jeu 12 Mai 2016 - 21:45, édité 1 fois

MlleSnake
**

Féminin
Messages : 97
Inscrit(e) le : 09/10/2010

http://wearegodsnow.forumactif.com/
MlleSnake a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script de catégories en onglets

Message par MlleSnake le Jeu 5 Mai 2016 - 5:47

un petit up

MlleSnake
**

Féminin
Messages : 97
Inscrit(e) le : 09/10/2010

http://wearegodsnow.forumactif.com/
MlleSnake a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script de catégories en onglets

Message par MD2 le Jeu 5 Mai 2016 - 12:19

Hello, serait-il possible d'avoir un screen par rapport avec votre deuxième problème ?

Cordialement.

MD2
****

Masculin
Messages : 264
Inscrit(e) le : 27/01/2016

http://densetsuno.forumactif.org/
MD2 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script de catégories en onglets

Message par MlleSnake le Ven 6 Mai 2016 - 16:28

Je sais pas si il est bien clair, mais le voilà :


MlleSnake
**

Féminin
Messages : 97
Inscrit(e) le : 09/10/2010

http://wearegodsnow.forumactif.com/
MlleSnake a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script de catégories en onglets

Message par MlleSnake le Dim 8 Mai 2016 - 20:17

up ^^

MlleSnake
**

Féminin
Messages : 97
Inscrit(e) le : 09/10/2010

http://wearegodsnow.forumactif.com/
MlleSnake a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script de catégories en onglets

Message par MlleSnake le Mer 11 Mai 2016 - 5:30

up =)

EDIT : J'ai réussi à trouver le problème pour ma première question. Par contre, je me demande encore pourquoi le nom des catégories ne s'affiche pas, ce serait plus simple pour que les gens comprennent où ils sont..

MlleSnake
**

Féminin
Messages : 97
Inscrit(e) le : 09/10/2010

http://wearegodsnow.forumactif.com/
MlleSnake a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script de catégories en onglets

Message par MlleSnake le Jeu 12 Mai 2016 - 21:45

Je laisse tomber ma question, je crois que ça va aller comme ça.

Merci quand même!

MlleSnake
**

Féminin
Messages : 97
Inscrit(e) le : 09/10/2010

http://wearegodsnow.forumactif.com/
MlleSnake 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