Onglets

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Onglets

Message par Poupou le Mer 13 Oct 2010 - 18:12

Bonjour !

Voila, je suis en train de mettre en place ma page d'accueil. En modifiant le contenu du premier onglet sur ma page d'accueil, impossible d'ouvrir les autres ! Venez voir par vous même, le contenu ne change plus --" ICI

Code de la PA:
Code:
<div id="mes_onglets">
    <ul><li id="o_1" class="mon_onglet_selected" onclick="changeOnglet(this);">Accueil</li>
        <li id="o_2" class="mon_onglet" onclick="changeOnglet(this);">News & Event</li>
        <li id="o_3" class="mon_onglet" onclick="changeOnglet(this);">Staff</li>
        <li id="o_4" class="mon_onglet" onclick="changeOnglet(this);">Amis & Remerciements</li>
        <div class="clear"><div id="mes_contenus">
    <div id="co_1" class="mon_contenu">Bienvenue !<br>
        <table>
      <tr>
        <td>
          <p>Quae dum ita struuntur, indicatum est apud Tyrum indumentum regale textum occulte, incertum quo locante vel cuius usibus apparatum. ideoque rector provinciae tunc pater Apollinaris eiusdem nominis ut conscius ductus est aliique congregati sunt ex diversis civitatibus multi, qui atrocium criminum ponderibus urgebantur.<br>
          Toi et moi c'est pour la vie je l'espère.</p>
        </td>
        <td>
          <IMG SRC="http://i24.servimg.com/u/f24/15/74/75/68/fc028j11.jpg">
        </td>
            </tr>
        </table>
        </center>
    <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></div></ul></div>


Dernière édition par Poupou le Dim 17 Oct 2010 - 12:06, édité 1 fois

Poupou
*

Messages : 33
Inscrit(e) le : 19/08/2010

http://g-e-v.lebonforum.com/
Poupou a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Onglets

Message par Invité le Mer 13 Oct 2010 - 18:18

Bonjour,

Il manque une ligne sur votre page d'accueil pour que les onglets fonctionnent.
Code:
<script src="ADRESSE_DU_FICHIER.js"></script>

Voici le script à enregistrer en .js et à héberger:
Code:
function changeOnglet(_this){
    var getOnglets    = document.getElementById('mes_onglets').getElementsByTagName('li');
    for(var i = 0; i < getOnglets.length; i++){
        if(getOnglets[i].id){
            if(getOnglets[i].id == _this.id){
                getOnglets[i].className = 'mon_onglet_selected';
                document.getElementById('c' + _this.id).style.display            = 'block';
            }
            else{
                getOnglets[i].className = 'mon_onglet';
                document.getElementById('c' + getOnglets[i].id).style.display    = 'none';
            }
        }
    }         
}

Cordialement.

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Onglets

Message par Poupou le Mer 13 Oct 2010 - 22:33

Merci de votre réponse.

Ca ne fonctionne toujours pas ... Je ne dois pas être doué.

http://sd-2.archive-host.com/membres/up/113965783930418818/codagepa.js

J'ai pourtant bien rentré le code que vous m'aviez donné, mais le contenu des autres pages disparaissent maintenant.

Poupou
*

Messages : 33
Inscrit(e) le : 19/08/2010

http://g-e-v.lebonforum.com/
Poupou a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Onglets

Message par Invité le Jeu 14 Oct 2010 - 8:44

Bonjour,

Le contenu disparait parce que le bloc contenu de votre premier onglet n'est pas fermé. Il est nécessaire de bien fermer les balises pour que le système fonctionne. En ajoutant</div> juste après </center> le contenu des autres onglets réapparait.
Code:
<script src="http://sd-2.archive-host.com/membres/up/113965783930418818/codagepa.js"></script><div id="mes_onglets">
    <ul><li id="o_1" class="mon_onglet_selected" onclick="changeOnglet(this);">Accueil</li>
        <li id="o_2" class="mon_onglet" onclick="changeOnglet(this);">News & Event</li>
        <li id="o_3" class="mon_onglet" onclick="changeOnglet(this);">Staff</li>
        <li id="o_4" class="mon_onglet" onclick="changeOnglet(this);">Amis & Remerciements</li>
        <div class="clear"><div id="mes_contenus">
    <div id="co_1" class="mon_contenu">Bienvenue !<br>
        <center><table>
      <tr>
        <td>
          <p>Quae dum ita struuntur, indicatum est apud Tyrum indumentum regale textum occulte, incertum quo locante vel cuius usibus apparatum. ideoque rector provinciae tunc pater Apollinaris eiusdem nominis ut conscius ductus est aliique congregati sunt ex diversis civitatibus multi, qui atrocium criminum ponderibus urgebantur.<br>
          Toi et moi c'est pour la vie je l'espère.</p>
        </td>
        <td>
          <IMG SRC="http://i24.servimg.com/u/f24/15/74/75/68/fc028j11.jpg">
        </td>
            </tr>
        </table>
        </center></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>
Cordialement.

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Onglets

Message par Poupou le Dim 17 Oct 2010 - 12:05

Merci beaucoup Isolde !

Poupou
*

Messages : 33
Inscrit(e) le : 19/08/2010

http://g-e-v.lebonforum.com/
Poupou a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum