Ma demande
Bonjour ♥
Je travaille en ce moment sur un design de forum et je suis face à une jolie épine bien profondément plantée *métaphore off*. Plus sérieusement, j'ai trouvé pas mal de tutoriel pour les catégories rétractables seulement... bah ils ne fonctionnent pas avec le codage hyper modifié sur lequel je travail et je n'y connais absolument rien en javascript donc je sèche totalement. Les catégories et les forums associés prennent beaucoup de place et j'aimerais vraiment qu'ils puissent être réductibles à volonté parce qu'ils sont nombreux. Et autant j'arrive à me dépatouiller à l'arrache avec du CSS et du HTML et à faire un truc fonctionnel, autant au javascript on touche vraiment à quelque chose que je ne comprends pas du tout.
Bref c'était l'intro éternelle juste pour savoir si :
1) un code de catégories rétractables serait adaptable à mon code
2) si quelqu'un aurait le temps et l'envie d'au moins m'expliquer comment ça marche (ou de le faire carrément mais juste m'expliquer clairement suffirait).
Bref du coup voilà, je reviens supplier .o. Merci d'avance.
Schéma(s) et Eléments
Schémas : Que le titre de la catégorie soit la seule chose visible après clic
Tailles des éléments : Les dimensions de mon titre de catégorie si ça a de l'importance pour le code : 770*67
Effets voulus : J'aimerais bien de préférence que le bouton du clic soit à côté du titre de la catégorie
Version de votre forum : PHPBB2
Ressources
La totalité de mon template index_box parce qu'il est fait un peu bizarrement et que c'est sûrement pour ça que les codes préfabriqués trouvés sur internet s'y accordent mal :
- 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 -->
<center><span class="gensmall">{LAST_VISIT_DATE} ▬ {CURRENT_TIME}
</span></center>
<center><a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a> ▬ <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a> ▬ <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a></center>
<!-- END switch_user_logged_in -->
</td>
</tr>
</table>
<!-- BEGIN catrow --><!-- BEGIN tablehead --><div class="TitreCategorie"><br/><br/><br/>{catrow.tablehead.L_FORUM}</div><table class="forumline" width="100%" border="0" cellspacing="0" cellpadding="0">
<!-- 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 -->
<table class="forumline" id="categories" width="100%" border="0" cellspacing="0" cellpadding="0" valign="top">
<tr><div class="index_fo"><img src="http://i.imgur.com/YEb6oPo.png"/></div>
<!-- BEGIN inc -->
<!-- END inc -->
<td class="row1 over" valign="top" width="100%;" height="50" colspan="4">
<center><h{catrow.forumrow.LEVEL} class="hierarchy">
<div class="forumlink">
<a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}" style="color:#ffffff">{catrow.forumrow.FORUM_NAME}</a>
</div></h{catrow.forumrow.LEVEL}></center>
</td></tr>
<tr><td class="{catrow.cathead.inc.INC_CLASS}" width="82"><img src="{SPACER}" height="0" width="82" /></td>
<td width="455x"><div class="genmed">{catrow.forumrow.FORUM_DESC}</div></td>
<td valign="top"><div class="forme" id="subforums"><img src="http://i.imgur.com/DOSAQZs.png"/> <span>{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS} </span> <script type="text/javascript">
jQuery('#subforums').html(jQuery('#subforums').html().replace(/, /g,'<br/>')).removeAttr('id');
</script></div>
</td><td class="{catrow.cathead.inc.INC_CLASS}" width="82"><img src="{SPACER}" height="0" width="82" /></td></tr></table>
<table><tr><td class="{catrow.cathead.inc.INC_CLASS}" width="3"><img src="{SPACER}" height="0" width="3" /></td>
<td><div class="sujet_msg">{catrow.forumrow.TOPICS} sujets, {catrow.forumrow.POSTS} réponses </div></td>
<td class="row1" align="center" valign="top" height="50" width="100" colspan="4">
<div class="gensmall" id="LastPost">
{catrow.forumrow.LAST_POST}</div><br/>
<div class="no_new"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /></div></td>
</tr>
<img src="{SPACER}" alt="" height="15" width="1" class="bordures"/>
<!-- 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="15" width="1" /><!-- END tablefoot --><!-- END catrow -->
Autres précisions ?
Les catégories ressemblent à ça (pour la partie avec le titre), sinon le reste des forums dans les catégories c'est la même chose à partir d'au-dessus du titre.
- Spoiler:
Dernière édition par JodieCravery le Lun 13 Juin 2016 - 0:34, édité 1 fois
