Problèmes avec liens des sous forums dans catégories

[xL2auurie]

Bonsoir à vous
Je viens à vous aujourd'hui pour avoir un petit coup de main. Je suis en pleine création de mon forum et j'ai refais des catégories à ma façon. J'ai donc refais mon template Index-Box en y incluant une partie où je peux y mettre une navigation rapide avec les liens des sous-forums cachés sous une image qui dévoile le texte en disparaissant vers le bas, le problème est que les liens n'apparaissent pas.. :'(

Avant la transition:

Après la transition, pas de liens :'( :

Je vous mets ici la partie du template concerné. En espérant avoir une solution à mon problème
Merci !

Spoiler:

[Neptunia]

Bonjour ^^

Le lien mentionné sur votre profil redirige sur du forumperso.com et je doute que ce forum soit le vôtre.
Pourriez-vous préciser le lien du forum concerné ?

Vous ne fournissezez pas le css associé, mais dans votre autre sujet vous avez un css avec les class .contenu et .contenant pour votre page d'accueil.
Votre index_box réutilise ces mêmes identifiants, mais peut-être que le code utilisé aurait besoin d'identifiants distincts ?

Pour finir votre morceau de template contient une erreur

Code:

<div style="contenu">

Je m'abstiendrais de dire ce qui cloche, je pense que vous avez le niveau pour trouver l'erreur par vous-même.

---

Edité à 00h05
A mon avis, les deux problèmes sont liés. Une fois que l'un sera solutionné, je pense que vous déduirez la solution de l'autre.

[xL2auurie]

Rebonsoir
D'abord, merci de vous pencher sur mon sujet. Pour la petite information je ne suis pas une pro des CSS et autres donc je vais peut-être louper le problème Je me base beaucoup sur des sujet de CSS Actif, Never utopia et autres sites donc je ne vais pas me venter d'être une pro, disons que je me débrouille

Le forum est http://bkv-test.forumgratuit.be/ Comme vous pouvez le remarquer, le code de transition fonctionne parfaitement, mais en ce qui concerne l'apparition des derniers sujet, rien :'(

Vous avez besoin de quel CSS ?

EDIT 00h24 : J'ai finalement compris qu'il que je devais changer ma <div style="contenu"> en <div class="contenu"> (a) Le problème de la PA est réglé, je vais changer le post en résolu pour la PA, néanmoins le problème de lien n'est pas résolu :'(

[Self]

Bonsoir,

Pour le problème des liens remplacer le script par celui-ci devrait résoudre le problème :

Code:

jQuery(function($){
    $('#subforums').html($('#subforums').html().replace(/,/g, ' • ')).removeAttr('id');
});

[xL2auurie]

Bonjour
Merci de vous être penché sur le sujet, mais le code ne fonctionne toujours pas :/
Voilà la partie qui concerne ma catégorie, en espérant trouver une solution.
merci à vous

Code:

 <span class="genmed"><table><tr><td><br><div class="fonddescri">{catrow.forumrow.FORUM_DESC}</div></td><td><br><div class="contenant"><div class="contenu"><span class="gensmall" id="subforums">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS} </span><script type="text/javascript">
        jQuery(function($){
            $('#subforums').html($('#subforums').html().replace(/,/g, ' • ')).removeAttr('id');
        });
</script></div><img src="http://img15.hostingpics.net/pics/841459nuage.png"/>
      </div></td> </tr></table></span>

[Self]

Bonjour,

Dans ce cas pourrait-on avoir le template en entier et le CSS concerné ?

[xL2auurie]

Biensur
Voici le template concerné et le CSS des catégories et de la navigation rapide.

Code:

<br><div id="conteneur_onglets">
<table><tr>
   <td class="onglet"><div>Nom onglet 1</div></td>
   <td class="onglet"><div>Nom onglet 2</div></td>
   <td class="onglet"><div>Nom onglet 3</div></td>
   <td class="onglet"><div>Nom onglet 4</div></td>
   <td class="onglet"><div>Nom onglet 5</div></td>
</tr></table><br>
</div>
<div id="conteneur_categories">
<!-- BEGIN catrow --><!-- BEGIN tablehead -->
<div class="categorie"><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<img src="http://img15.hostingpics.net/pics/302221rubanhaut.png" alt="" />
   <tr>
              <th colspan="4"><table width="100%"><tr><td nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </td>   
                  <td nowrap="nowrap" width="150"><div style="width:150px;"></div></td></tr></table></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">&nbsp;</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">
         
      </td>
      <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50%">
         <h{catrow.forumrow.LEVEL} class="hierarchy">
            <br><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"><table><tr><td><br><div class="fonddescri">{catrow.forumrow.FORUM_DESC}</div></td><td><br><div class="contenant"><div class="contenu"><span class="gensmall" id="subforums">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS} </span><script type="text/javascript">
        jQuery(function($){
            $('#subforums').html($('#subforums').html().replace(/,/g, ' • ')).removeAttr('id');
        });
</script></div><img src="http://img15.hostingpics.net/pics/841459nuage.png"/>
      </div></td> </tr></table></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>
      </td>
      
          <td class="row3 over" align="center" valign="middle" height="50"><br><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /><br>
            <div class="messc"><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="http://img15.hostingpics.net/pics/302692Rubanbas.png" height="1" width="1" /></td>
   </tr>
   <!-- END catfoot -->
         <!-- BEGIN tablefoot -->
</table><img src="{SPACER}" alt="" height="0" width="1" /><img src="http://img15.hostingpics.net/pics/302692Rubanbas.png" alt="" />
</div>
<!-- END tablefoot --><!-- END catrow --></div>


Code:


/*Navig rapide*/

div.contenant {
            width:145px;/*largeur du contenant, la meme que celle de l image*/
            height:80px;/*hauteur du contenant, la meme que celle de l image*/
            overflow: hidden;
 margin-left:27px;margin-top:-10px;text-align:justify;font-size:8px;background: #f6fee1; border-top:3px solid #5dd0c6; border-right:3px solid #b5d16c; border-left:3px solid #b5d16c; border-bottom:3px solid #5dd0c6; border-radius: 5px 5px 5px 5px
        }
        div.contenu {
            width: 145px;/*largeur du contenu, la meme que celle de l image*/
            height: 80px;/*hauteur du contenu, la meme que celle de l image*/
            overflow: auto;/*pour apparition d une scroll bar si le texte est trop long*/
 
        }
        .contenant img {
            width:auto;/*largeur de l image*/
            height:auto;/*hauteur de l image*/
            position: relative;
            top: -80px;/*ici mettre la hauteur de l image en négatif*/
            transition: 0.5s;/*durée de l effet de transition*/
  border-radius: 5px 5px 5px 5px
        }
        .contenant:hover img {/*au survol de la souris sur le bloc*/
            top: 0px;/*ici mettre deux fois la hauteur de l image en négatif pour un déplacement vers le haut*/
            transition: 2s;/*durée de l effet de transition*/
  border-radius: 5px 5px 5px 5px
        }
/*Fin Navig rapide*/

/*CATEGO*/

@font-face {
  font-family: 'Amatic SC';
  font-style: normal;
  font-weight: 400;
  src: local('Amatic SC Regular'), local('AmaticSC-Regular'), url(http://themes.googleusercontent.com/static/fonts/amaticsc/v3/DPPfSFKxRTXvae2bKDzp5D8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
.messc {
background: #f6fee1;
border-top:3px solid #5dd0c6; border-right:3px solid #b5d16c; border-left:3px solid #b5d16c; border-bottom:3px solid #5dd0c6; border-radius: 5px 5px 5px 5px;
  height:74px;
    width:145px;
  text-transform:lowercase;
  font-size:14px;
  margin-top:10px;
  margin-left:-24px;
  margin-right:19px;
  padding:3px;
}
.fonddescri {
  width:400px;
  padding-top:7px;
  text-align:justify;
  height:76px;
  margin-right:-10px;
  margin-left:10px;
    margin-top:-13px;
background: #f6fee1;
border-top:3px solid #5dd0c6; border-right:3px solid #b5d16c; border-left:3px solid #b5d16c; border-bottom:3px solid #5dd0c6; border-radius: 5px 5px 5px 5px}
.fonddescri:hover {
  border-bottom: 3px solid #; }

.textsousfo {
  background-color: #d6f1ef;
  width:130px;
  height:65px;
  overflow:auto;
  padding-right:20px;
  padding-left:20px;
  text-align:justify;
  font-size:8px;
  padding-top:10px;
  text-transform:uppercase;

}
.image {
  background:ta couleur de fond si besoin;
  position:relative;
  width:XXpx; /* tu détermines la largeur */
  height:Xpx; /* tu détermines la hauteur */
  overflow:hidden;
  margin-bottom:39px;
}

.texte {
  position:absolute;
  height:75px; /* encore la hauteur*/
  width:113px;  /* la largeur */
  border-radius:20px;
  padding-left:10px;
    padding-right:10px;
  text-align:justify;
  font-size:11px;
  font-family:times;
  padding-top:10px;

  margin-bottom:-150px; /* tu décales vers le bas il faut donc la même valeur que pour ta hauteur ! */
  background-color: #FFF5E9; /*indique la couleur de fond de ton choix*/
  opacity:0,8;
bottom:0;
  left:0;
    transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
 transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
}

.image:hover .texte {
  margin:0;
}


/*FIN CATEGO*/


[Self]

N'avez-vous pas simplement oublié de cocher oui dans l'option "Lien vers les niveaux inférieurs :" du panneau d'adminsitration (Affichage > Page d'accueil > Structure et hiérarchie) ?

[xL2auurie]

Oh mais quelle blonde !
Effectivement c'était ça ! J'étais tellement collée le nez dans le template que j'y ai pas pense !
Merci !!!!
Résolu !

[Neptunia]

Re ^^

Vous ne fournissezez pas le css associé, mais dans votre autre sujet vous avez un css avec les class .contenu et .contenant pour votre page d'accueil.
Votre index_box réutilise ces mêmes identifiants, mais peut-être que le code utilisé aurait besoin d'identifiants distincts ?

Mes soupçons initiaux se confirment
Pour ceux qui ont manqué le début Problème avec PA

Votre CSS comporte bel et bien 2 sections (peut-être davantage)

Code:

div.contenant {
...
...
}

Code:

div.contenu {
...
...
}

L'un pour votre PA, l'autre pour la transition de vos sous-forums. Ceci avec des valeurs différentes.
Si ma mémoire est bonne, c'est la deuxième définition qui prendra le pas sur la première et je suppose donc que la section concernant votre page d'accueil est plus loin vers le bas de page que celle concernant les sous-forums.

Il va donc falloir modifier vos class dans l'index_box ainsi que dans le CSS pour qu'elles ne soient plus utilisées à plusieurs endroits necessitant des réglages différents.

[Self]

Il va donc falloir modifier vos class dans l'index_box ainsi que dans le CSS pour qu'elles ne soient plus utilisées à plusieurs endroits necessitant des réglages différents.

On peut aussi remonter (selon la préférence) plus loin dans arborescence et pour le CSS concernant les sous-forums mettre devant div.contenant et div.contenu la class .categorie :

Code:

.categorie div.contenant{
    /*code*/
}

.categorie div.contenu{
    /*code*/
}

[Chacha]

Oh mais quelle blonde !
Effectivement c'était ça ! J'étais tellement collée le nez dans le template que j'y ai pas pense !
Merci !!!!
Résolu !

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