Tableau à onglets

[FCBfan]

Salut tout le monde, je voudrais savoir comment faire pour créer un tableau sur la page d'accueil, avec des onglets, c'est-à-dire lorsqu'on clic sur un onglet, le contenu change.
le meme genre que ça : http://www.fifa-tournois.com/
Merci

[Calimerotte]

Bonsoir

Vous trouverez une réponse sur ce sujet :
► Faire des onglets sur la Page d'Acceuil.

Cali.

[FCBfan]

J'arrive pas à le faire, il y a trop de code, si quelqu'un pourrait me passer directement le code à mettre sa serait gentil.

[Invité]

Bonjour,

Si on vous donne le code tout fait, identique au forum que vous avez mis en exemple, ça s'appelle du plagiat. (d'autant plus qu'il y a sacrément de travail dessus!). Et si vous désirez changer le tableau, vous ne pourrez pas le faire seul. Je veux bien vous guider pas à pas, mais le résultat ne sera pas tout à fait identique au tableau en exemple car il y a des fonctionnalités que je ne connais pas ...

Il n'y a pas tant de code que ça, il y en a 2, la page d'accueil et la CSS.
Dans le message d'accueil:

Code:

<script src="http://pmsc.free.fr/J04/10912150254.js"></script><div id="mes_onglets">
    <ul><li id="o_1" class="mon_onglet_selected" onclick="changeOnglet(this);">Onglet 1</li>
        <li id="o_2" class="mon_onglet" onclick="changeOnglet(this);">Onglet 2</li>
        <li id="o_3" class="mon_onglet" onclick="changeOnglet(this);">Onglet 3</li>
        <li id="o_4" class="mon_onglet" onclick="changeOnglet(this);">Onglet 4</li>
        <div class="clear"><div id="mes_contenus">
    <div id="co_1" class="mon_contenu">Mon contenu 1</div>
    <div id="co_2" class="mon_contenu" style="display: none;">Mon contenu 2</div>
    <div id="co_3" class="mon_contenu" style="display: none;">Mon contenu 3</div>
    <div id="co_4" class="mon_contenu" style="display: none;">Mon contenu 4</div>
</div></ul>

Dans la CSS:

Code:

ul, li{
  list-style: none;
}
.mon_onglet{
  float: left;
  padding: 2px 10px;
  margin-right: 5px;
  color: #fff;
  background: #000000;
  border: 2px solid #4682b4;
  cursor: pointer;
  margin-bottom: -1px;
} 
.mon_onglet:hover{
  background: #000000;
}           
.mon_onglet_selected{
  float: left;
  padding: 2px 10px;
  margin-right: 5px;
  color: #fff;
  background:#000000;
  border-top: 2px solid #4682b4;
  border-right: 2px solid #4682b4;
  border-left: 2px solid #4682b4; 
  border-bottom: 1px solid #000000; 
  cursor: pointer; 
  margin-bottom: -1px;
}             
.clear{
  clear: both;
}
.mon_contenu{
  color: #fff;
  background: #000000;
  border: 2px solid #4682b4;
  padding: 10px;
        margin: -1px;           
}
#mes_contenus, #mes_onglets{
  width: 400px;
}

Pour le message de page d'accueil, remplacez "onglet 1" par le titre de l'onglet, et "Mon contenu 1" par ce que vous voulez voir en dessous.
Pour la CSS, si vous avez besoin d'aide pour la personnalisation, je peux essayer de vous aider.

Cordialement.

[FCBfan]

Non j'ai pas dis que je voulais avoir le même je demandai seulement le code pour faire un tableau à onglet ^^
Merci j'essaye sa de suite