Créer des onglets sur sa page d'acceuil

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

Résolu Créer des onglets sur sa page d'acceuil

Message par CryingToYourHeart le Lun 9 Juil 2012 - 23:31

Bonjour,

J'aimerais à l'aider de ces trois PA n'en faire qu'une seule et faire des onglets, j'ai déjà tenté plusieurs choses mais je ne suis jamais arrivé au résultat que je souhaiterais.
En fait je voudrais que les onglets soient sous cette forme:

http://thewerewolfpack.forumgratuit.org/h3-pa2

Code:
<table class="marge" background="http://img233.imageshack.us/img233/7263/toij.png"  border="0" cellspacing="0" height="700" width="700"  >
<td ><br><br><br><br><br><br><br><br>
<center><iframe  name="staff" src="http://thewerewolfpack.forumgratuit.org/h1-home" scrolling="no" height="540" width="700" FRAMEBORDER="no"></iframe></center>
</table>



<table class="marge" background="http://img155.imageshack.us/img155/534/toi2.png"  border="0" cellspacing="0" height="700" width="700"  >
<td ><br><br><br><br><br><br><br><br>
<center><iframe  name="staff" src="http://thewerewolfpack.forumgratuit.org/h2-info" scrolling="no" height="540" width="700" FRAMEBORDER="no"></iframe></center>
</table>


<table class="marge" background="http://img442.imageshack.us/img442/8076/toi3.png"  border="0" cellspacing="0" height="700" width="700"  >
<td ><br><br><br><br><br><br><br><br>
<center><iframe  name="staff" src="http://thewerewolfpack.forumgratuit.org/h4-plus" scrolling="no" height="540" width="700" FRAMEBORDER="no"></iframe></center>
</table>

Merci à ceux qui voudront bien m'aider Smile


Dernière édition par CryingToYourHeart le Lun 30 Juil 2012 - 23:17, édité 2 fois

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par CryingToYourHeart le Mer 11 Juil 2012 - 2:22

up

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par CryingToYourHeart le Jeu 12 Juil 2012 - 3:10

up

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par XxSven le Jeu 12 Juil 2012 - 4:55

Je te conseille de suivre ce tuto:

http://forum.forumactif.com/t310879-tableaux-a-onglets

Et tu adaptes le css qui te conviens Razz

XxSven
*

Masculin
Messages : 49
Inscrit(e) le : 06/06/2012

http://nintendo-play.pro-forums.fr/
XxSven a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par CryingToYourHeart le Jeu 12 Juil 2012 - 22:39

Bonjour,

Je ne crois pas que ça pourra m'aider, sachant que je mettrais ma PA en iframe par la suite dans la partie correspondante sur le forum.

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par CryingToYourHeart le Ven 13 Juil 2012 - 22:38

up

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par CryingToYourHeart le Dim 15 Juil 2012 - 14:14

up

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par CryingToYourHeart le Lun 16 Juil 2012 - 23:20

up

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par CryingToYourHeart le Mer 18 Juil 2012 - 11:55

up

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par CryingToYourHeart le Jeu 19 Juil 2012 - 12:18

up

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par CryingToYourHeart le Sam 21 Juil 2012 - 17:45

up

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par CryingToYourHeart le Dim 22 Juil 2012 - 17:41

up

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par CryingToYourHeart le Mer 25 Juil 2012 - 16:59

up

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par CryingToYourHeart le Lun 30 Juil 2012 - 20:12

up, s'il vous plait aider moi ça devient un peu urgent :s

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par tupac le Lun 30 Juil 2012 - 23:09

Bonsoir

Placer le tout dans une page HTML puis dans une iframe, il me semble que vous savez faire.

Spoiler:
Code:
<style>
       
.mon_onglet{
          padding: 4px;
          margin: 10px;
          display: inline;
}       
             
.mon_onglet_selected{
          padding: 4px;
          margin: 10px;
          display: inline;
}           
             
.mon_contenu{
          padding: 0px;
          height: auto;      /* hauteur du tableau */
          width:auto;        /* largeur du tableau */
          margin-top: 5px;    /* marge entre le tableau et les onglets */
}
       
</style>

<script>
        function changeOnglet(_this){
            var getOnglets    = document.getElementById('mes_onglets').getElementsByTagName('span');
            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';
                    }
                }
            }   
        }
</script>

        <div id="mes_onglets">

<!-- onglet 1 -->
            <span id="o_1" class="mon_onglet_selected" onclick="changeOnglet(this);"><img src="http://i45.servimg.com/u/f45/15/55/14/56/zzzzzx12.gif"></span>

<!-- onglet 2 -->
            <span id="o_2" class="mon_onglet" onclick="changeOnglet(this);"><img src="http://i45.servimg.com/u/f45/15/55/14/56/zzzzqk10.gif"></span>

<!-- onglet 3 -->
            <span id="o_3" class="mon_onglet" onclick="changeOnglet(this);"><img src="http://i45.servimg.com/u/f45/15/55/14/56/zzzzwq14.gif"></span>


  <div id="mes_contenus">

<!-- contenu onglet 1 -->
  <div id="co_1" class="mon_contenu">

<table class="marge" background="http://img233.imageshack.us/img233/7263/toij.png"  border="0" cellspacing="0" height="700" width="700"  >
<td ><br><br><br><br><br><br><br><br>
<center><iframe  name="staff" src="http://thewerewolfpack.forumgratuit.org/h1-home" scrolling="no" height="540" width="700" FRAMEBORDER="no"></iframe></center>
</table>
  </div>

<!-- contenu onglet 2 -->
    <div id="co_2" class="mon_contenu" style="display: none;">

<table class="marge" background="http://img155.imageshack.us/img155/534/toi2.png"  border="0" cellspacing="0" height="700" width="700"  >
<td ><br><br><br><br><br><br><br><br>
<center><iframe  name="staff" src="http://thewerewolfpack.forumgratuit.org/h2-info" scrolling="no" height="540" width="700" FRAMEBORDER="no"></iframe></center>
</table>
  </div>

<!-- contenu onglet 3 -->
    <div id="co_3" class="mon_contenu" style="display: none;">

<table class="marge" background="http://img442.imageshack.us/img442/8076/toi3.png"  border="0" cellspacing="0" height="700" width="700"  >
<td ><br><br><br><br><br><br><br><br>
<center><iframe  name="staff" src="http://thewerewolfpack.forumgratuit.org/h4-plus" scrolling="no" height="540" width="700" FRAMEBORDER="no"></iframe></center>
</table>
  </div>

  </div></div>

tupac
+ Hyperactif +

Masculin
Messages : 2331
Inscrit(e) le : 13/10/2010

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

Résolu Re: Créer des onglets sur sa page d'acceuil

Message par CryingToYourHeart le Lun 30 Juil 2012 - 23:16

Merci beaucoup c'est exactement ce que je souhaitais Very Happy

CryingToYourHeart
****

Féminin
Messages : 404
Inscrit(e) le : 18/01/2012

http://thewerewolfpack.forumgratuit.org/
CryingToYourHeart 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