Créer une organisation par onglets (messages) - Page 4 Bouton_activeCréer une organisation par onglets (messages) - Page 4 Bouton_hoverCréer une organisation par onglets (messages) - Page 4 Fb-hoverCréer une organisation par onglets (messages) - Page 4 Fb-active
CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur:

Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus!

Derniers sujets
» Système d'onglets simple et personnalisable
Créer une organisation par onglets (messages) - Page 4 EmptyLun 03 Juin 2024, 17:20 par birds

» Fiche de Présentation RPG
Créer une organisation par onglets (messages) - Page 4 EmptySam 30 Mar 2024, 22:07 par Peyton972

» [RPG] Fiche personnage avec bannière
Créer une organisation par onglets (messages) - Page 4 EmptySam 30 Mar 2024, 22:06 par Peyton972

» Structure de Qui Est En Ligne (1)
Créer une organisation par onglets (messages) - Page 4 EmptyLun 04 Mar 2024, 23:20 par Peyton972

» Qui Est En Ligne - Utopia
Créer une organisation par onglets (messages) - Page 4 EmptyDim 24 Déc 2023, 18:16 par romee

» Pack forum complet "Androïd Sylver" RPU (N°2)
Créer une organisation par onglets (messages) - Page 4 EmptyJeu 02 Nov 2023, 06:42 par Hydrar

» Formulaire de connexion rapide amélioré
Créer une organisation par onglets (messages) - Page 4 EmptySam 04 Mar 2023, 18:57 par Krager

» Avatar centré dans le profil
Créer une organisation par onglets (messages) - Page 4 EmptySam 11 Fév 2023, 06:04 par Krager

Le Deal du moment :
Boutique Nike : -25% dès 50€ sur TOUT le ...
Voir le deal

Partagez
 

Créer une organisation par onglets (messages)

Voir le sujet précédent Voir le sujet suivant Aller en bas 
Aller à la page : Précédent  1, 2, 3, 4, 5, 6, 7  Suivant
http://test-brain.forumgratuit.org
Brain
Brain
{ Membre }
{ Membre }

Masculin Messages : 25



Créer une organisation par onglets (messages) - Page 4 Empty
Super merci maintenant faut que je teste .
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyDim 12 Sep 2010, 03:40
Revenir en haut Aller en bas
Zilah
Zilah
{ Membre }
{ Membre }

Féminin Messages : 60



Créer une organisation par onglets (messages) - Page 4 Empty
Bonjour !
Pour moi ça ne marche pas ... C'est la partie sous les onglets qui ne s'affiche pas. Regardez par vous même ici
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyLun 13 Sep 2010, 06:54
Revenir en haut Aller en bas
http://misslitchyproduction.yourme.net
Kimy
{ Membre actif }
{ Membre actif }

Féminin Messages : 1190



Créer une organisation par onglets (messages) - Page 4 Empty
Zilah, on ne peut pas t'aider si tu nous donnes pas de code à vérifier pareil pour Æ
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyLun 13 Sep 2010, 07:11
Revenir en haut Aller en bas
Zilah
Zilah
{ Membre }
{ Membre }

Féminin Messages : 60



Créer une organisation par onglets (messages) - Page 4 Empty
Désolée ><

Voici mon CSS :
Code:
.onglet
        {
                display:inline-block;
                margin-left:3px;
                margin-right:3px;
                padding:3px;
                border:1px solid black;
                cursor:pointer;
        }
        .onglet_0
        {
                background:#bbbbbb;
                border-bottom:1px solid black;
        }
        .onglet_1
        {
                background:#dddddd;
                border-bottom:0px solid black;
                padding-bottom:4px;
        }
        .contenu_onglet
        {
                background-color:#dddddd;
                border:1px solid black;
                margin-top:-1px;
                padding:5px;
                display:none;
        }

body { margin : 0 ; }
.bodylinewidth {
border-left :solid 5px ;
border-right :solid 5px ;
}

Et ma P.A :
Code:
<div class="systeme_onglets">

        <div class="onglets">
            <span class="onglet_0 onglet" id="onglet_nom_de_longlet" onclick="javascript:change_onglet('nom_de_longlet');">Nom de l'onglet</span>
            <span class="onglet_0 onglet" id="onglet_nom_de_longlet" onclick="javascript:change_onglet('nom_de_longlet');">Nom de l'onglet</span>
            <span class="onglet_0 onglet" id="onglet_nom_de_longlet" onclick="javascript:change_onglet('nom_de_longlet');">Nom de l'onglet</span>
        </div>

        <div class="contenu_onglets">
            <div class="contenu_onglet" id="contenu_onglet_nom_de_longlet">Contenu de l'onglet</div>

            <div class="contenu_onglet" id="contenu_onglet_nom_de_longlet">Contenu de l'onglet</div>

            <div class="contenu_onglet" id="contenu_onglet_nom_de_longlet">Contenu de l'onglet</div>
        </div>
    </div>
    <script type="text/javascript">
        //<!--
                var anc_onglet = 'quoi';
                change_onglet(anc_onglet);
        //-->
        </script>

J'ai ajouté le script du tuto concernant le lien HTML dans ma description mais pas dans le template. Je ne trouve pas overall_header_new. Je ne l'ai que sans new xD
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyLun 13 Sep 2010, 07:21
Revenir en haut Aller en bas
http://misslitchyproduction.yourme.net
Kimy
{ Membre actif }
{ Membre actif }

Féminin Messages : 1190



Créer une organisation par onglets (messages) - Page 4 Empty
C'est bien overall_header le template ^^

Sinon le soucis vient de là :

Code:
<script type="text/javascript">
        //<!--
                var anc_onglet = 'quoi';
                change_onglet(anc_onglet);
        //-->
        </script>

A la place du quoi il faut que tu mettes le nom de ton premier onglet.
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyLun 13 Sep 2010, 07:26
Revenir en haut Aller en bas
Zilah
Zilah
{ Membre }
{ Membre }

Féminin Messages : 60



Créer une organisation par onglets (messages) - Page 4 Empty
Je ne comprend pas ce que je dois mettre .. xD
Un lien ? Simplement un nom ? Je suis un peu perdue..
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyLun 13 Sep 2010, 07:31
Revenir en haut Aller en bas
http://misslitchyproduction.yourme.net
Kimy
{ Membre actif }
{ Membre actif }

Féminin Messages : 1190



Créer une organisation par onglets (messages) - Page 4 Empty
Je te l'ai dis. Le nom de ton premier onglet.
Si tu appelles ton premier onglet : onglet1 par exemple
et bien tu remplaces le script par :

Code:
<script type="text/javascript">
        //<!--
                var anc_onglet = 'onglet1';
                change_onglet(anc_onglet);
        //-->
        </script>
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyLun 13 Sep 2010, 07:44
Revenir en haut Aller en bas
Zilah
Zilah
{ Membre }
{ Membre }

Féminin Messages : 60



Créer une organisation par onglets (messages) - Page 4 Empty
Le nom c'est bien celui qu'il y a dans mon CSS ?
Le problème c'est que je ne comprends toujours pas, et ça ne marche pas non plus xD
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyMar 14 Sep 2010, 04:47
Revenir en haut Aller en bas
http://misslitchyproduction.yourme.net
Kimy
{ Membre actif }
{ Membre actif }

Féminin Messages : 1190



Créer une organisation par onglets (messages) - Page 4 Empty
Code:
<div class="onglets">
            <span class="onglet_0 onglet" id="onglet_nom_de_longlet" onclick="javascript:change_onglet('nom_de_longlet');">Nom de l'onglet</span>
            <span class="onglet_0 onglet" id="onglet_nom_de_longlet" onclick="javascript:change_onglet('nom_de_longlet');">Nom de l'onglet</span>
            <span class="onglet_0 onglet" id="onglet_nom_de_longlet" onclick="javascript:change_onglet('nom_de_longlet');">Nom de l'onglet</span>
        </div>

C'est dans cette partie là que tu nommes tes onglets.
Ici tu leur as donné le même nom à tous qui est : nom_de_longlet
D'ailleurs je te conseille de leur donner des noms différents pour éviter quelques bugs. Et quand tu auras choisi le nom de ton premier onglet il faudra que tu l'inscrives à la place du "quoi"
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyMar 14 Sep 2010, 08:25
Revenir en haut Aller en bas
Zilah
Zilah
{ Membre }
{ Membre }

Féminin Messages : 60



Créer une organisation par onglets (messages) - Page 4 Empty
Code:
<div class="systeme_onglets">

        <div class="onglets">
            <span class="onglet_0 onglet" id="Onglet1" onclick="javascript:change_onglet('Onglet1');">Rules</span>
            <span class="onglet_0 onglet" id="Onglet 2" onclick="javascript:change_onglet('Onglet2');">Contexte</span>
            <span class="onglet_0 onglet" id="Onglet3" onclick="javascript:change_onglet('Onglet3');">Avatars</span>
        </div>

        <div class="contenu_onglets">
            <div class="contenu_onglet" id="Contenu1">Contenu de l'onglet</div>

            <div class="contenu_onglet" id="Contenu2">Contenu de l'onglet</div>

            <div class="contenu_onglet" id="Contenu3">Contenu de l'onglet</div>
        </div>
    </div>
    <script type="text/javascript">
        //<!--
                var anc_onglet = 'Onglet1';
                change_onglet(anc_onglet);
        //-->
        </script>

Merci de ton aide !
Voilà ce que j'ai mais ça ne marche toujours pas ..
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyMar 14 Sep 2010, 11:17
Revenir en haut Aller en bas
http://misslitchyproduction.yourme.net
Kimy
{ Membre actif }
{ Membre actif }

Féminin Messages : 1190



Créer une organisation par onglets (messages) - Page 4 Empty
Alors c'est normal.

Code:
<span class="onglet_0 onglet" id="Onglet1" onclick="javascript:change_onglet('Onglet1');">Rules</span>
Ici tu as mis pour id : Onglet1
Alors que pour son contenu tu as mis ceci
Code:
<div class="contenu_onglet" id="Contenu1">Contenu de l'onglet</div>
id : Contenu1

Il faut que les id du contenu et de son onglet soient les même
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyMar 14 Sep 2010, 11:30
Revenir en haut Aller en bas
Zilah
Zilah
{ Membre }
{ Membre }

Féminin Messages : 60



Créer une organisation par onglets (messages) - Page 4 Empty
Ca ne marche toujours pas ><
Je crois que je vais laisser tomber les onglets ! Merci quand même.
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyMar 14 Sep 2010, 12:54
Revenir en haut Aller en bas
http://deathforum.megabb.com
Naoko144
{ Membre }
{ Membre }

Féminin Messages : 35



Créer une organisation par onglets (messages) - Page 4 Empty
Voilà, j'ai suivi tout le tutoriel, le tout marche très bien... Seulement lorsque je viens pour ajouter des nouveau onglet, cela ne marche pas .-.
vous pouvez voir ici http://testdemoa.bbactif.com/forum.htm

et voici mon html et mon CSS

HTML
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Un système d'onglet en javascript</title>
    <script type="text/javascript">
        //<!--
                function change_onglet(name)
                {
                        document.getElementById('onglet_'+anc_onglet).className = 'onglet_0 onglet';
                        document.getElementById('onglet_'+name).className = 'onglet_1 onglet';
                        document.getElementById('contenu_onglet_'+anc_onglet).style.display = 'none';
                        document.getElementById('contenu_onglet_'+name).style.display = 'block';
                        anc_onglet = name;
                }
        //-->
        </script>
    <style type="text/css">
        .onglet
        {
                display:inline-block;
                margin-left:3px;
                margin-right:3px;
                padding:3px;
                border:1px solid black;
                cursor:pointer;
        }
        .onglet_0
        {
                background:#bbbbbb;
                border-bottom:1px solid black;
        }
        .onglet_1
        {
                background:#dddddd;
                border-bottom:0px solid black;
                padding-bottom:4px;
        }
        .contenu_onglet
        {
                background-color:#dddddd;
                border:1px solid black;
                margin-top:-1px;
                padding:5px;
                display:none;
        }
        ul
        {
                margin-top:0px;
                margin-bottom:0px;
                margin-left:-10px
        }
        h1
        {
                margin:0px;
                padding:0px;
        }
        </style>
</head>
<body>
        <div class="systeme_onglets">
        <div class="onglets">
            <span class="onglet_0 onglet" id="onglet_quoi" onclick="javascript:change_onglet('quoi');">Bienvenue</span>
<span class="onglet_0 onglet" id="onglet_World" onclick="javascript:change_onglet('World');">World</span>
<span class="onglet_0 onglet" id="onglet_Personnages" onclick="javascript:change_onglet('Personnages');">Personnages</span>
            <span class="onglet_0 onglet" id="onglet_DragonCharm & CourageousDragon" onclick="javascript:change_onglet('DragonCharm & CourageousDragon');">DragonCharm & CourageousDragon</span>
            <span class="onglet_0 onglet" id="onglet_En parlez" onclick="javascript:change_onglet('En parlez');">En parlez</span>
<span class="onglet_0 onglet" id="onglet_Copyright" onclick="javascript:change_onglet('Copyright');">Copyright</span>
        </div>
        <div class="contenu_onglets">
            <div class="contenu_onglet" id="contenu_onglet_quoi">
                <h1>Bienvenue à vous!</h1>
                Vous êtes présentement sur le forum Privé de Dragon Charm & Courageous Dragon! Vous ne pouvez malheureusement pas vous joindre à nous pour le RP, voyant que nous choississons nous même les membres qui auront la possibilité de venir lire ce qui se passe dans cet univers.
CEPENDANT, nous vous invitons bien sur à prendre connaissance de qu'est-ce que c'est en détail.
blablabla.<br />
                <ul>
                    <li> Lien vers 'Présentation de qui on est'</li>
                    <li> Lien vers 'qu'est-ce que c'est?'</li>
                    <li> Lien vers la zone commentaire et flood</li>

COPYRIGHT du template d'onglet pour les catégories à Basil Hawkins de CSSActif!!!
                </ul>
            </div>
            <div class="contenu_onglet" id="contenu_onglet_World">
                <h1>L'univers</h1>
                C'est un script réalisé par Ybouane,<br />
                Webmaster du site <a href="http://www.supportduweb.com/">http://www.supportduweb.com/</a>
            </div>
            <div class="contenu_onglet" id="contenu_onglet_Personnages">
                <h1>Personnages</h1>
                Pour simplifier la navigation et la diviser en parties
            </div><div class="contenu_onglet" id="contenu_onglet_DragonCharm & CourageousDrago">Contenu de l'onglet</div><div class="contenu_onglet" id="contenu_onglet_En parlez">Contenu de l'onglet</div><div class="contenu_onglet" id="contenu_onglet_Copyright">Contenu de l'onglet</div>
        </div>
    </div>
    <script type="text/javascript">
        //<!--
                var anc_onglet = 'quoi';
                change_onglet(anc_onglet);
        //-->
        </script>
</body>
</html>


CSS
Code:
.forumline{
border: 3px #ccc785
double;
}

body { cursor: crosshair }
a:hover { cursor:ne-resize; }

td.row1{
background-image: url("http://up4u.free.fr/images/a9lrvy3g2ue29meoa75.png");
}
td.row2{
background-image: url("http://up4u.free.fr/images/a9lrvy3g2ue29meoa75.png");
}
td.row3{
background-image: url("http://up4u.free.fr/images/a9lrvy3g2ue29meoa75.png");
}


u{border-bottom: 2px solid;border-color:#B0ADA0;text-decoration: none;
-moz-border-radius:6px;}

I{border-bottom:none; color:#7A5E5E;text-decoration: none
}
.onglet
        {
                display:inline-block;
                margin-left:3px;
                margin-right:3px;
                padding:3px;
                border:1px solid black;
                cursor:pointer;
        }
        .onglet_0
        {
                background:#bbbbbb;
                border-bottom:1px solid black;
        }
        .onglet_1
        {
                background:#dddddd;
                border-bottom:0px solid black;
                padding-bottom:4px;
        }
        .contenu_onglet
        {
                background-color:#dddddd;
                border:1px solid black;
                margin-top:-1px;
                padding:5px;
                display:none;
        }

a:hover {
text-decoration: none ; color: black ; border-bottom: 1px dotted #B0ADA0;
}

.bodylinewidth {
width:70%}

a img {
border: none;
}

a.mainmenu{
 text-decoration: none;
 color : #000000;
}
a.mainmenu:hover{
 text-decoration: none;
 color : #B0ADA0;
 }

a:link {text-decoration: none;}
a:hover{text-decoration: none !important;}
a { text-decoration: none; }
a:link { text-decoration: none; }
a:hover { text-decoration: none; }
a:hover{text-transform:uppercase;}

.quote{
font-family: Tahoma;
font-size: 12px;
color: #000000;
line-height: 125%;
background-color: #CCC785;
border: #cfcdce;
border-style: solid;
border: 1px #a08491
dotted;
border-left-width: 1px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
-moz-border-radius:6px;}

.code{
font-family: Courier,Courier New,sans-serif;
font-size: 11px;
color: #000000;
background-color: #CCC785;
border: #cfcdce;
border-style: solid;
border-left-width: 1px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px
border: 1px #a08491
dotted;
-moz-border-radius:6px;}

.forumline{
background-color: #7A5E5E;
-moz-border-radius: 0px 0px 14px 14px ;
border-bottom: 6px #7A5E5E solid;
border-top: 1px #7A5E5E dotted;
border-right: 1px #7A5E5E dotted;
border-left: 1px #7A5E5E dotted;}


a.forumlink:hover, a.forumlink:hover:visited{
background-color: #7A5E5E;
border-left: 9px solid #7A5E5E;
border-right: 9px solid #7A5E5E;
-moz-border-radius:15px;}

a.mainmenu:link, a.mainmenu:visited{
margin-left : 6px;
margin-right : 6px;
font-family :Georgia;
color: #818181;
background-image: url("http://up4u.free.fr/images/a9lrvy3g2ue29meoa75.png");
text-align:left;
border-left: 6px solid #C9BAAB;
border-right: 9px solid: url("http://up4u.free.fr/images/a9lrvy3g2ue29meoa75.png");
}

a.mainmenu:hover, a.mainmenu:hover:visited{
color: #908789;
border-left: 6px solid #7A5E5E;
border-right: 9px solid: url("http://up4u.free.fr/images/a9lrvy3g2ue29meoa75.png");
}

a {font-variant: small-caps;}

.my_modified_table{
  width: 80%;
  margin-left: 10%;
margin-right: 10%;
margin-top: 5px !important;

font-family: Verdana;
}

.onglets{
  right: 40%;
  position:relative;
  width: 500px;
}

.my_forum_name{
  display:none;
}
.my_img{
width: 10%;
margin-left: 50px;
}
.my_disc{
width: 70%;
text-align:center;
font-size: 13px;
}
.my_stats{
font-size: 10px;

 width: 20%;
text-align:center;
}

.myfoo_title{
  text-align:center;
  width: 100%;
  -moz-border-radius: 6px;
  border: 1px solid #EAEAEA;

}
.my_title{
  text-align:center;
  font-size: 14px;
font-family: Arial;
}

.my_cat_body{
background-color: #ffffff;
border: 1px solid #EEE;
-moz-border-radius: 3px;

}

.my_cat ul{
margin:0;
padding: 0;
width: 800px !important;
}
.my_cat li{
margin-left: 2px;
}
.my_cat_style{
border-top: 1px #666 solid;
border-left: 1px #666 solid;
border-right: 1px #666 solid;
-moz-border-radius-topleft: 6px;
-moz-border-radius-topright: 6px;
text-align:center;
font-size: 11px;
padding-left:10px;
padding-right:10px;
display:inline;
background-color: #EAEAEA;
width: 200px;
font-family: Arial;
font-weight: bold;

}
.my_cat a{
text-decoration: none !important;
color: #000;
}

et si cela peu aider voila aussi mon Over_all header, mais je doute qu'il soit fautif ( je crois que tout est dans le HTML en faites .-. ) alors je le met sous spoiler

Spoiler:

Merci beaucoup de m'aider! .-. C'est pas génial quand les onglets flottent subitement dans les airs !
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyLun 20 Sep 2010, 13:41
Revenir en haut Aller en bas
http://misslitchyproduction.yourme.net
Kimy
{ Membre actif }
{ Membre actif }

Féminin Messages : 1190



Créer une organisation par onglets (messages) - Page 4 Empty
Bonjour =)
Tout d'abord je ne sais pas si cela vient de là mais il faut à tout prix éviter de mettre des majuscules et des espaces dans le code en lui-même. Par exemple DragonCharm & CourageousDragon, tu peux le mettre tel quel pour le nom de l'onglet mais dans le code non

Par exemple cette ligne :
Code:
  <span class="onglet_0 onglet" id="onglet_DragonCharm & CourageousDragon" onclick="javascript:change_onglet('DragonCharm & CourageousDragon');">DragonCharm & CourageousDragon</span>
c'est mieux qu'elle devienne
Code:
  <span class="onglet_0 onglet" id="onglet_dragon" onclick="javascript:change_onglet('dragon');">DragonCharm & CourageousDragon</span>
Ce n'est pas grave si tu ne mets pas la même chose que le titre. Il faut simplement que le mot que tu mettras dans "id" et dans "onlick" soit le même.
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyLun 20 Sep 2010, 13:48
Revenir en haut Aller en bas
http://deathforum.megabb.com
Naoko144
{ Membre }
{ Membre }

Féminin Messages : 35



Créer une organisation par onglets (messages) - Page 4 Empty
hum, j'ai changer ce que tu mas dit, mais cela nas rien changer =/ les onglets continuent de flotter dans les airs .-. je le re-met ici comme j'ai apporté quelques changement.


Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Un système d'onglet en javascript</title>
    <script type="text/javascript">
        //<!--
                function change_onglet(name)
                {
                        document.getElementById('onglet_'+anc_onglet).className = 'onglet_0 onglet';
                        document.getElementById('onglet_'+name).className = 'onglet_1 onglet';
                        document.getElementById('contenu_onglet_'+anc_onglet).style.display = 'none';
                        document.getElementById('contenu_onglet_'+name).style.display = 'block';
                        anc_onglet = name;
                }
        //-->
        </script>
    <style type="text/css">
        .onglet
        {
                display:inline-block;
                margin-left:3px;
                margin-right:3px;
                padding:3px;
                border:1px solid black;
                cursor:pointer;
        }
        .onglet_0
        {
                background:#bbbbbb;
                border-bottom:1px solid black;
        }
        .onglet_1
        {
                background:#dddddd;
                border-bottom:0px solid black;
                padding-bottom:4px;
        }
        .contenu_onglet
        {
                background-color:#dddddd;
                border:1px solid black;
                margin-top:-1px;
                padding:5px;
                display:none;
        }
        ul
        {
                margin-top:0px;
                margin-bottom:0px;
                margin-left:-10px
        }
        h1
        {
                margin:0px;
                padding:0px;
        }
        </style>
</head>
<body>
        <div class="systeme_onglets">
        <div class="onglets">
            <span class="onglet_0 onglet" id="onglet_quoi" onclick="javascript:change_onglet('quoi');">Bienvenue</span>
<span class="onglet_0 onglet" id="onglet_world" onclick="javascript:change_onglet('world');">World</span>
<span class="onglet_0 onglet" id="onglet_personnages" onclick="javascript:change_onglet('personnages');">Personnages</span>
            <span class="onglet_0 onglet" id="onglet_dragon" onclick="javascript:change_onglet('dragon');">DragonCharm & CourageousDragon</span>
            <span class="onglet_0 onglet" id="onglet_parlez" onclick="javascript:change_onglet('parlez');">En parlez</span>
<span class="onglet_0 onglet" id="onglet_copyright" onclick="javascript:change_onglet('copyright');">Copyright</span>
        </div>
        <div class="contenu_onglets">
            <div class="contenu_onglet" id="contenu_onglet_quoi">
                <h1>Bienvenue à vous!</h1>
                Vous êtes présentement sur le forum Privé de Dragon Charm & Courageous Dragon! Vous ne pouvez malheureusement pas vous joindre à nous pour le RP, voyant que nous choississons nous même les membres qui auront la possibilité de venir lire ce qui se passe dans cet univers.
CEPENDANT, nous vous invitons bien sur à prendre connaissance de qu'est-ce que c'est en détail.
blablabla.<br />
                <ul>
                    <li> Lien vers 'Présentation de qui on est'</li>
                    <li> Lien vers 'qu'est-ce que c'est?'</li>
                    <li> Lien vers la zone commentaire et flood</li>

COPYRIGHT du template d'onglet pour les catégories à Basil Hawkins de CSSActif!!!
                </ul>
            </div>
            <div class="contenu_onglet" id="contenu_onglet_world">
                <h1>L'univers</h1>
                C'est un script réalisé par Ybouane
            </div>
            <div class="contenu_onglet" id="contenu_onglet_personnages">
                <h1>Personnages</h1>
                Pour simplifier la navigation et la diviser en parties
            </div><div class="contenu_onglet" id="contenu_onglet_dragon">Contenu de l'onglet</div><div class="contenu_onglet" id="contenu_onglet_parlez">Contenu de l'onglet</div><div class="contenu_onglet" id="contenu_onglet_copyright">Contenu de l'onglet</div>
        </div>
    </div>
    <script type="text/javascript">
        //<!--
                var anc_onglet = 'quoi';
                change_onglet(anc_onglet);
        //-->
        </script>
</body>
</html>
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyLun 20 Sep 2010, 13:55
Revenir en haut Aller en bas
http://misslitchyproduction.yourme.net
Kimy
{ Membre actif }
{ Membre actif }

Féminin Messages : 1190



Créer une organisation par onglets (messages) - Page 4 Empty
Yattahhh j'ai fini par trouver >w<
Bon le problème vient de là

Code:
.onglets{
  right: 40%;
  position:relative;
  width: 500px;
}

Si tu enlèves ce code tout se met en place comme il faut.
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyLun 20 Sep 2010, 15:01
Revenir en haut Aller en bas
http://deathforum.megabb.com
Naoko144
{ Membre }
{ Membre }

Féminin Messages : 35



Créer une organisation par onglets (messages) - Page 4 Empty
Cela marche merci! =)
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyLun 20 Sep 2010, 17:10
Revenir en haut Aller en bas
http://dtbh-rpg.forumactif.org/index.htm
Lira
Lira
{ Membre }
{ Membre }

Féminin Messages : 182



Créer une organisation par onglets (messages) - Page 4 Empty
Salut !

J'ai tout bêtement essayé dans ma PA et ça ne marche pas du tout... J'ai le nom des onglets, le cadre mais c'est tout...

HTML :
Spoiler:


Y'a toujours ":" qui se rajoute après le "onclick="javascript" à la place des :


CSS :
Spoiler:


Dernière édition par Lira le Mar 21 Sep 2010, 16:39, édité 1 fois
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyMar 21 Sep 2010, 16:09
Revenir en haut Aller en bas
http://misslitchyproduction.yourme.net
Kimy
{ Membre actif }
{ Membre actif }

Féminin Messages : 1190



Créer une organisation par onglets (messages) - Page 4 Empty
Bonsoir Lira =)
Alors tout d'abord il y a des endroits où tu n'as pas tout bien remplacer :

Code:
<span class="onglet_0 onglet" id="onglet_qeel" onclick="javascript:change_onglet('nom_de_longlet');">Qui est là ?</span>
          <span class="onglet_0 onglet" id="onglet_partenaires" onclick="javascript:change_onglet('nom_de_longlet');">Partenaires</span>

Il reste des "nom_de_longlet"

Le soucis majeur ensuite vient je pense d'ici :

Code:
<!--
                var anc_onglet = 'quoi';
                change_onglet(anc_onglet);
        //-->
        </script>

Il faut que tu remplaces le "quoi" par le nom de ton premier onglet
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyMar 21 Sep 2010, 16:35
Revenir en haut Aller en bas
http://dtbh-rpg.forumactif.org/index.htm
Lira
Lira
{ Membre }
{ Membre }

Féminin Messages : 182



Créer une organisation par onglets (messages) - Page 4 Empty
J'étais justement entrain d'éditer (maintenant que j'ai envoyé les modifs je vois ta réponse --") et normalement tout est remplacé. Mais ça ne marche toujours pas...
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyMar 21 Sep 2010, 16:43
Revenir en haut Aller en bas
http://kiss-university.forumactif.org/
Ikø'
Ikø'
Pika'Ghøst~ Maîtresse des pelles ~
Pika'Ghøst
~ Maîtresse des pelles ~

Féminin Messages : 3193



Créer une organisation par onglets (messages) - Page 4 Empty
Code:
<div class="systeme_onglets">

        <div class="onglets">
            <span class="onglet_0 onglet" id="onglet_accueil" onclick="javascript:change_onglet('accueil');">Accueil</span>
            <span class="onglet_0 onglet" id="onglet_staff" onclick="javascript:change_onglet('staff');">Staff</span>
            <span class="onglet_0 onglet" id="onglet_qeel" onclick="javascript:change_onglet('qeel');">Qui est là ?</span>
          <span class="onglet_0 onglet" id="onglet_partenaires" onclick="javascript:change_onglet('partenaires');">Partenaires</span>
        </div>

        <div class="contenu_onglets">
            <div class="contenu_onglet" id="contenu_onglet_accueil">Forum alliant l'ambiance sombre de Darker Than Black et l'énergie de The Law Of Ueki dans une course effrénée au pouvoir absolu. Incarnerez-vous un être céleste, un Contractant ou un simple participant à la recherche du Don Vierge ?<br><br><div style="text-align: center;"><font style="color: Red;" size="4">/!\</font><br>Ce forum ne prend en compte que la première saison de Darker Than Black afin de ne spoiler personne et de ne pas générer de conflits d'idéaux dans la zone de flood.<br><font style="color: Red;" size="4">/!\</font><br></div></div>

            <div class="contenu_onglet" id="contenu_onglet_staff">On verra plus tard</div>

            <div class="contenu_onglet" id="contenu_onglet_qeel">Qui est là ?</div>

            <div class="contenu_onglet" id="contenu_onglet_partenaires">Pas encore</div>
        </div>
    </div>
    <script type="text/javascript">
        //<!--
                var anc_onglet = 'accueil';
                change_onglet(anc_onglet);
        //-->
        </script>
Au début, à ('accueil'), il te manquait les apostrophes.
Aussi, au lieu de mettre "contenu_onglet_qeel" tu avais mit "contenu_nom_de_qeel" x)

Dit moi si ça marche maintenant~
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyMar 21 Sep 2010, 16:51
Revenir en haut Aller en bas
http://dtbh-rpg.forumactif.org/index.htm
Lira
Lira
{ Membre }
{ Membre }

Féminin Messages : 182



Créer une organisation par onglets (messages) - Page 4 Empty
Toujours pas ^^" (merci de m'aider déjà.)
C'est peut-être à cause d'une erreur dans le code de la page HTML ? Il fallait bien le mettre tel quel ?

Puis à chaque fois que j'enregistre après j'obtiens ça :
Code:
  <span class="onglet_0 onglet" id="onglet_accueil" onclick="javascript:change_onglet('accueil');">Accueil</span>
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyMar 21 Sep 2010, 16:55
Revenir en haut Aller en bas
http://misslitchyproduction.yourme.net
Kimy
{ Membre actif }
{ Membre actif }

Féminin Messages : 1190



Créer une organisation par onglets (messages) - Page 4 Empty
Tu as bien mis le script à mettre dans le template overall_header ?
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyMar 21 Sep 2010, 16:56
Revenir en haut Aller en bas
http://dtbh-rpg.forumactif.org/index.htm
Lira
Lira
{ Membre }
{ Membre }

Féminin Messages : 182



Créer une organisation par onglets (messages) - Page 4 Empty
Je crois... Ici :

Code:
<!-- END google_analytics_code -->
<script language="javascript" src="http://dtbh-rpg.forumactif.com/Page-d-accueil-h1.htm"></script>
</head>
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyMar 21 Sep 2010, 17:03
Revenir en haut Aller en bas
http://misslitchyproduction.yourme.net
Kimy
{ Membre actif }
{ Membre actif }

Féminin Messages : 1190



Créer une organisation par onglets (messages) - Page 4 Empty
Code:
<!-- END google_analytics_code -->
?

C'est quel template ça ?
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 EmptyMar 21 Sep 2010, 17:04
Revenir en haut Aller en bas
Contenu sponsorisé




Créer une organisation par onglets (messages) - Page 4 Empty
MessageSujet: Re: Créer une organisation par onglets (messages)   Créer une organisation par onglets (messages) - Page 4 Empty
Revenir en haut Aller en bas
 

Créer une organisation par onglets (messages)

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 4 sur 7Aller à la page : Précédent  1, 2, 3, 4, 5, 6, 7  Suivant

 Sujets similaires

-
» Organisation par onglets.
» Créer une ancre (messages)
» Créer un accordéon vertical (messages)
» Créer une barre de défilement (messages)
» Organisation des messages et des sujets.

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
CSSActif :: Corbeille :: Archives de CSSActif :: Archives 2009~2011-

Partenaires Or


← Page précédente   ↑ Aller en haut Copyright © CSSActif 2009 - 2013 Tous droits réservés
Créer un forum | ©phpBB | Forum gratuit d'entraide | Signaler un abus | Cookies | Forum gratuit