Onclik Change Catégorie
4 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Onclik Change Catégorie
Donc voilà voilà, déjà bonjour à ceux qui passeront ici
Enfin bon je viens pour une demande assez spéciale qui sera pour mon forum: http://comics-universe-rpg.forums-rpg.com/
Et la où j'ai pu voir ce que je voulais : http://exceed-art.forumactif.info/
il s'agit en faite des onglets situés au dessus des catégories, je me doutais que c'était un onclik mais je ne m'attendais pas à ce que l'on puisse faire ça sur la structure du forum
Cela pourrait m'être assez utile étant donné que le mien est très grand!
Donc voilà, je me doute qu'il y a du Javascript, et autre commande, mais même si j'arrive à comprendre rapidement, je ne suis pas assez qualifié pour faire ce qu'ils ont fait, donc c'était pour avoir de l'aide.
Merci d'avance.
Enfin bon je viens pour une demande assez spéciale qui sera pour mon forum: http://comics-universe-rpg.forums-rpg.com/
Et la où j'ai pu voir ce que je voulais : http://exceed-art.forumactif.info/
il s'agit en faite des onglets situés au dessus des catégories, je me doutais que c'était un onclik mais je ne m'attendais pas à ce que l'on puisse faire ça sur la structure du forum
Cela pourrait m'être assez utile étant donné que le mien est très grand!
Donc voilà, je me doute qu'il y a du Javascript, et autre commande, mais même si j'arrive à comprendre rapidement, je ne suis pas assez qualifié pour faire ce qu'ils ont fait, donc c'était pour avoir de l'aide.
Merci d'avance.
Dernière édition par microstart le Sam 5 Mar 2011 - 15:48, édité 1 fois
Re: Onclik Change Catégorie
Salut
Voici un générateur pour mettre les onglets comme sur ce forum :
http://shared-development.clanteam.com/onglets.php
Voici un générateur pour mettre les onglets comme sur ce forum :
http://shared-development.clanteam.com/onglets.php
Re: Onclik Change Catégorie
Oh Rapide, merci bien je vais tester ça
Re: Onclik Change Catégorie
Me revoilà donc j'ai posté le tout:
Le truc c'est que je me retrouve avec une drôle de forme, ce qui ne m'étonne pas, j'aimerais donc pouvoir comme sur l'autre forum, les aligner puis après pouvoir changer les textes en images.
- Spoiler:
- <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}<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>
<!-- DEBUT MODIF ONGLETS -->
<script type="text/javascript">
<!--
document.write('<div align="center" style="display:none;" id="conteneur_barre_onglet">
<ul class="conteneur_onglets">
<li onClick="change_cat(1)" class="onglet actif" id="onglet_1">Comics Universe</li>
<li onClick="change_cat(2)" class="onglet " id="onglet_2">Journal Du Forum</li>
<li onClick="change_cat(3)" class="onglet " id="onglet_3">Taverne et Hors RPG</li>
<li onClick="change_cat(4)" class="onglet " id="onglet_4">Mode RPG</li>
<li onClick="change_cat(5)" class="onglet " id="onglet_5">Marvel World</li>
<li onClick="change_cat(6)" class="onglet " id="onglet_6">DC Universe</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
{
$('#conteneur_barre_onglet').css("display","block");
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><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 -->
{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 -->
Le truc c'est que je me retrouve avec une drôle de forme, ce qui ne m'étonne pas, j'aimerais donc pouvoir comme sur l'autre forum, les aligner puis après pouvoir changer les textes en images.
Re: Onclik Change Catégorie
Le plus simple est d'aller sur Never Utopia et de voir le tutoriel fait par Vic le faucheur. Le générateur est de sa conception. En plus de la modification du template, il faut installer du css dans ta feuille de style.
Re: Onclik Change Catégorie
Bonjour
Voici le CSS qui va avec vos onglet a placer dans votre feuille de style.
Panneau d'administration:
1/ Affichage
2/ couleurs
3/ Feuille de style css
Voici le CSS qui va avec vos onglet a placer dans votre feuille de style.
Panneau d'administration:
1/ Affichage
2/ couleurs
3/ Feuille de style css
- Spoiler:
- Code:
.onglet{
color: #9aa277; /* couleur texte */
font-family: Georgia, Verdana, Arial, serif; /* police écriture */
background-color: #; /* couleur fond onglet */
background: url('url de votre image') no-repeat;
display:inline-block;
margin-right:4px; /* marge entre les onglets */
margin-bottom:-20px; /* marge entre onglet et catégorie */
padding:5px; /* marge entre le texte et les bords de l'onglet */
border:1px solid #0F0505; /* bordure onglet */
cursor:pointer;
-moz-border-radius: 7px 7px 7px 7px; /* arrondi les angles */
-webkit-border-radius: 7px 7px 7px 7px;
border-radius: 7px 7px 7px 7px;
}
.actif { /*Onglet survolé*/
color: #fff;
background-color : #;
background: url('url de votre image') no-repeat;
margin-right:8px;
padding:5px;
border:2px solid #0F0505;
cursor: pointer;
-moz-border-radius: 7px 7px 7px 7px;
-webkit-border-radius: 7px 7px 7px 7px;
border-radius: 7px 7px 7px 7px;
}
Re: Onclik Change Catégorie
Super, ça marche très bien, j'irais quand même voir sur never utopia les différentes tuto qu'ils ont mit, encore merci à vous, je mets le sujet en résolu.
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum