Problem mit Code (Box mit Registerkarten)

Hallo,
ich hatte versucht eine Box mit Registerkarten zu erstellen. So wie diese hier:

Spoiler:

Doch irgendwie will das nicht funktionieren.
Bekomme es zwar hin das sie so aussieht, aber die lässt sich nicht umblättern auf die nächsten reiter.

So sieht mein Code aus

Code:

<div id="mes_onglets">
                                      <ul>
                                        <li id="o_1" class="mon_onglet_selected" onclick="changeOnglet(this);"></li>
                                        <li id="o_2" class="mon_onglet" onclick="changeOnglet(this);"></li>
                                        <li id="o_3" class="mon_onglet" onclick="changeOnglet(this);"></li>
                                        <li id="o_4" class="mon_onglet" onclick="changeOnglet(this);"></li>
                                        <li id="o_5" class="mon_onglet" onclick="changeOnglet(this);"></li>
                                        <li id="o_6" class="mon_onglet" onclick="changeOnglet(this);"></li>
                                        <li id="o_7" class="mon_onglet" onclick="changeOnglet(this);"></li>
                                        <li id="o_8" class="mon_onglet" onclick="changeOnglet(this);"></li>
                                        <li id="o_9" class="mon_onglet" onclick="changeOnglet(this);"></li>
                                        <li id="o_10" class="mon_onglet" onclick="changeOnglet(this);"></li>
                                        <li id="o_11" class="mon_onglet" onclick="changeOnglet(this);"></li>
                                        <div class="clear">
                                          <div id="mes_contenus">
                                            <div id="co_1" class="mon_contenu"></div>
                                            <div id="co_2" class="mon_contenu" style="display: none;"></div>
                                            <div id="co_3" class="mon_contenu" style="display: none;"></div>
                                            <div id="co_4" class="mon_contenu" style="display: none;"></div>
                                            <div id="co_5" class="mon_contenu" style="display: none;"></div>
                                            <div id="co_6" class="mon_contenu" style="display: none;"></div>
                                            <div id="co_7" class="mon_contenu" style="display: none;"></div>
                                            <div id="co_8" class="mon_contenu" style="display: none;"></div>
                                            <div id="co_9" class="mon_contenu" style="display: none;"></div>
                                            <div id="co_10" class="mon_contenu" style="display: none;"></div>
                                            <div id="co_11" class="mon_contenu" style="display: none;"></div>
                                          </div>
                                        </div>
                                      </ul>
                                    </div>

Hoffe mir kann jemand helfen.
LG
Elektra

Wo hast du diesen Code her?
Das Bild scheint ja aus meinem Testforum zu sein.
Hast du das hier aus dem Support?
Hast du auch das Script und das dazugehörende CSS eingesetzt?

Hallo Frank,
ich hatte mir einige Beiträge angeschaut und bin dann in einen beitrag über dein testforum gestolpert. Eigendlich wollte ich mir auch so ein Colorpicker erstellen und hab dann diese Box bei dir gesehen. Weil ich diese ganz schön fand hatte ich dann versucht eine selber zu machen. Das bild hatte ich mit Snipping Tool gemacht, weil ich nicht wusste wie ich am besten erklären soll was ich mit dieser Box meinte.

CSS hatte ich mit Opera geschaut wie der so aufgebaut ist und dann versucht mir einen anzupassen.

Code:

.mon_onglet{
          float: left;
          background-image: url("http://i40.servimg.com/u/f40/16/50/10/42/spaceb10.jpg");
          border: 1px solid #4B45FF;
          cursor: pointer;
          padding: 2px 10px;
          margin-right: 5px;
          color: #ADB1FF;
          margin-bottom: -1px;
          list-style: none;
          font-family: Verdana;
          font-size: 9pt;
        }
        .mon_onglet:hover{
          background-image: url("http://i40.servimg.com/u/f40/16/50/10/42/spaceb10.jpg");
          color: #ADB1FF;
          font-family: Veranda;
          font-size: 9pt;
        }
        .mon_onglet_selected{
          float: left;
          padding: 2px 10px;
          margin-right: 5px;
          color: #ADB1FF;
          background-image: url("http://i40.servimg.com/u/f40/16/50/10/42/spaceb10.jpg");
          border-top: 1px solid #4B45FF;
          border-bottom: 1px solid #4B45FF;
          border-right: 1px solid #4B45FF;
          border-left: 1px solid #4B45FF;
          cursor: pointer;
          margin-bottom: -1px;
          list-style: none;
          font-family: Veranda;
          font-size: 9pt;
} 
        .mon_contenu{
          color: #ADB1FF;
          background-image: url("http://i40.servimg.com/u/f40/16/50/10/42/spaceb10.jpg");
          border: 1px solid #4B45FF;
          padding: 10px;
          line-height: normal;
          font-size: 11px;
          margin-top: -1px;}
        #mes_contenus, #mes_onglets{
          width: 830px;
          margin: auto;
          font-family: Veranda;
          font-size: 9pt;
}
        .clear{
          clear: both;
          font-family: Veranda;
          font-size: 9pt;
        }


Hoffe das ist ok. Sonst lasse ich das mit der Box sein. Das man einen script brauch wusste ich nicht... dachte der html und der css code würden reichen. Wenn das zu aufwändig sein sollte, lasse ich es lieber.
LG
Elektra

Nein, da ist auch noch ein Script dabei.
Es wurde auch hier schon mal erklärt, nur finde ich das im Moment nicht wieder. Ich habe schon alles was mir eingefallen ist gesucht...

Wenn jemand weis unter was der Beitrag gestanden hat, dann bitte mal einen Tip geben. Danke.

Edit: Dank Günther haben wir nun auch die Beschreibung dazu und auch wo du das Orginal findest.
https://hilfe.forumieren.com/t30208-tab-ansicht-changeonglet-spalten-menus-werden-falsch-angezeigt
Alles im ersten Beitrag von Cyborg. Nur in der Tabelle bei ihm ist ein Fehler. Aber weiter unten findest du die Tabelle aus meinem Testforum, die auf jeden Fall funktioniert.
Im ersten Beitrag im Spoiler findest du auch das CSS und auch das Script, das du dazu brauchst.
Du kannst das ruhig so übernehmen, weil das aus dem Französischen Support stammt.
Das ist auch der Grund warum die Bezeichnungen teilweise Französisch sind.

Noch mal Danke Günther, das du das wiedergefunden hast.

Dankeschön
Das hat mir weiter geholfen.

Icon wurde gesetzt, daher