| Quelques petites questions au sujet des ongles. | |
|
Bichou
{ Membre }
Messages : 42
| Bonsoir tout le monde Je viens vous voir ce soir afin de vous demander votre aide au sujet du classement des catégories en onglets sur les forums. J'aurai donc deux petites questions à vous poser à ce sujet, les voici : 1. Est-il possible d'intégrer deux catégories dans un même onglet ? Ou alors doit-on obligatoire à se limiter à une catégorie par onglet ? 2. J'ai un petit soucis avec les effets de mes onglets. Lorsque je clique sur un onglet pour l'afficher, il apparaît comme en "fondu", je ne sais pas trop expliquer et l'effet est trop rapide pour le prendre en capture d'écran. Pour essayer d'expliquer un peu plus clairement, ça apparaît avec une opacité 0, puis ça arrive à une opacité 100. Voilà, je vous remercie d'avance sur votre aide et je vous poste le contenu de mon template et de mes codes css au besoin Template : - Spoiler:
- Code:
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/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";> <ul class="conteneur_onglets";>
<li onClick="change_cat(1)" class="onglet actif" id="onglet_1">administration</li> <li onClick="change_cat(2)" class="onglet " id="onglet_2">gestion des personnages</li> <li onClick="change_cat(3)" class="onglet " id="onglet_3">monde réel</li> <li onClick="change_cat(4)" class="onglet " id="onglet_4">monde alternatif</li> <li onClick="change_cat(5)" class="onglet " id="onglet_5">flood & cie</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 { document.write('</table><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 -->
<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> <!-- BEGIN forum_link_no --> <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> <!-- END forum_link_no --> <!-- BEGIN forum_link --> <td class="row3" colspan="3" align="center" valign="middle" height="50"><span class="gensmall">{catrow.forumrow.forum_link.HIT_COUNT}</span></td> <!-- END forum_link --> </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 --> <img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow --> CSS : - Spoiler:
.onglet { /*Onglet non survolé*/ font-family: Time New Roman; font-size : 22px; Font-weight: bold; Font-style: italic; Letter-spacing: -2px; text-shadow: #362a21 1px 1px 1px; padding-left: 32px; padding-right: 32px; display: inline-block; margin-bottom:-18px; margin-left: -40px; -moz-border-radius-topleft: 8px; -moz-border-radius-topright: 8px; cursor: pointer; }
.actif { /*Onglet survolé*/ font-family: Time New Roman; font-size : 22px; Font-weight: bold; Font-style: italic; Letter-spacing: -2px; text-shadow: #362a21 1px 1px 1px; text-decoration:none; !important -moz-border-radius-topleft: 8px; -moz-border-radius-topright: 8px; }
|
Dernière édition par Bichou le Sam 22 Jan 2011, 08:14, édité 1 fois | |
|
| |
Phantasmagoria
{ Membre hyper-actif }
Messages : 1636
| Bonjour ^^
J'avoue n'avoir pas bien saisit le problème, j'ai testé les codes et ça marche. Peux tu nous donner l'adresse du forum pour qu'on voit ce qui cloche? Pour ce qui est de classer deux catégories dans le même onglet, je ne pense pas que ça se soit possible =/ | | |
|
| |
Bichou
{ Membre }
Messages : 42
| En fait, ce n'est pas qu'ils marchent pas, les codes marchent très bien mais j'avais besoin de quelques réponses à certaines questions. Tu as répondu à l'une d'entre elles en me disant qu'intégrer deux catégories dans un même onglet n'était sûrement pas possible. Va falloir que je me débrouille autrement donc. Après pour la seconde je vais sûrement avoir à te passer l'adresse de mon forum test car c'est pas vraiment facile à expliquer, je te l'envoie par MP. En fait le soucis c'est que les forums, lorsque je clique sur l'un des onglets, apparaissent en fondus, et j'aimerai savoir comment enlever cet effet. | | |
|
| |
Phantasmagoria
{ Membre hyper-actif }
Messages : 1636
| Bonjour ^^
Postes s'il te plait l'adresse de ton forum ici ^^ Mais je pense cerner ce que tu veux dire. Lorsque tu clique sur l'onglet le forum n'apparait pas directement c'est comme s'il clignote légèrement, en fait ce n'est pas un effet à par entier mais plutôt un effet de l'option "click" que tu as choisit lorsque tu as créer tes onglets dans le générateur tu as choisit click et non au survol, ce qui occasionne cet effet de clignement rapide ^^" | | |
|
| |
Bichou
{ Membre }
Messages : 42
| Ah oui en effet, tu as raison, ça doit être ça. Je vais essayer en prenant l'option survol, on va voir ce que ça donne. Merci pour ton aide. | | |
|
| |
Phantasmagoria
{ Membre hyper-actif }
Messages : 1636
| Je t'en prie ^^ Si ton problème est résolu j'te prie d'éditer ton premier message et de cocher l'icône Merci ^^ | | |
|
| |
Bichou
{ Membre }
Messages : 42
| Et bien en fait malheureusement ça n'a rien changé ... L'effet que je souhaite enlever est toujours là. Je poste l'adresse du forum : http://blood-falls.forumactif.com La tentative de changer en prenant en "survol" n'a pas marché, l'effet que je souhaitais enlever reste toujours là. Je vais donc remettre le mode, en "clic" car ça correspondait mieux à ce que je voulais. | | |
|
| |
Phantasmagoria
{ Membre hyper-actif }
Messages : 1636
| Je viens de voir un forum qui a un effet de survol et j'ai pas remarqué cet effet en fait ^^' mais c'est vrai que le click est mieux, esthétiquement parlant. Bref, ton problème est-il donc résolu? | | |
|
| |
Bichou
{ Membre }
Messages : 42
| Non, le problème est toujours là, les forums arrivent toujours en effet fondu ... Après je ne pense pas que ça vienne du click ni du survol car j'ai vu un forum justement en click ou cet effet n'est pas utilisé, donc je ne sais pas d'où ça peut venir ... | | |
|
| |
Kiwi
{ Membre }
Messages : 142
| Salut! Houlah, un moment que j'ai pas vu de jQuery, à force de bosser le JavaScript pur... Je pense que ça vient du fadeIn ^-^ Essaye de remplacer ça : (au passage, je vois pas pourquoi y a deux points virgules à la fin oO) - Code:
-
$('table[id=categorie_'+numero+']').fadeIn();; Par ça : - Code:
-
$('table[id=categorie_'+numero+']').css('display','block'); Bonne journée! Kiwi | | |
|
| |
Bichou
{ Membre }
Messages : 42
| Merci beaucoup Kiwi Tu as réglé mon problème ! J'en profite pour redemander, avant de classer ce sujet comme résolu, si vous êtes certains qu'on ne peut ajouter deux catégories par onglet. | | |
|
| |
Kiwi
{ Membre }
Messages : 142
| Je ne touche pas à ForumActif depuis un bon moment, aussi je ne peux faire que des suppositions, mais par expérience des templates en général, je dirai que non avec les tutos que tu pourras trouver habituellement. Mais oui, je pense que c'est faisable... En clair, j'ai quelques idées sur les manières de procéder. La zone Script pourra peut-être t'aider, je n'en sais rien, je n'y suis jamais allée, mais je ne suis pas certaine que CSSActif ait ce genre de compétences. Personnellement, je créerai une fonction getElementsByClass et selon leur position dans le DOM, je les afficherai ou pas dans l'onglet, ce serait un truc au cas par cas. Mais je n'ai pas trop le temps de me pencher sur une telle réalisation ^^' En tout cas, ce serait intéressant à faire Si un jour je m'ennuie ^^ Kiwi | | |
|
| |
Bichou
{ Membre }
Messages : 42
| Entendu, je ne suis pas assez douée pour tenter la chose, donc je pense que je vais m'arranger autrement. Merci beaucoup. | | |
|
| |
Kiwi
{ Membre }
Messages : 142
| De rien ^^ Bonne journée =) | | |
|
| |
Phantasmagoria
{ Membre hyper-actif }
Messages : 1636
| J'ai appris pas mal de chose o.o J'classe :p | | |
|
| |
Contenu sponsorisé
| |
| |
| Quelques petites questions au sujet des ongles. | |
|