Onglets à gauche/Accueil non réactif Bouton_activeOnglets à gauche/Accueil non réactif Bouton_hoverOnglets à gauche/Accueil non réactif Fb-hoverOnglets à gauche/Accueil non réactif 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
Onglets à gauche/Accueil non réactif EmptyLun 03 Juin 2024, 17:20 par birds

» Fiche de Présentation RPG
Onglets à gauche/Accueil non réactif EmptySam 30 Mar 2024, 22:07 par Peyton972

» [RPG] Fiche personnage avec bannière
Onglets à gauche/Accueil non réactif EmptySam 30 Mar 2024, 22:06 par Peyton972

» Structure de Qui Est En Ligne (1)
Onglets à gauche/Accueil non réactif EmptyLun 04 Mar 2024, 23:20 par Peyton972

» Qui Est En Ligne - Utopia
Onglets à gauche/Accueil non réactif EmptyDim 24 Déc 2023, 18:16 par romee

» Pack forum complet "Androïd Sylver" RPU (N°2)
Onglets à gauche/Accueil non réactif EmptyJeu 02 Nov 2023, 06:42 par Hydrar

» Formulaire de connexion rapide amélioré
Onglets à gauche/Accueil non réactif EmptySam 04 Mar 2023, 18:57 par Krager

» Avatar centré dans le profil
Onglets à gauche/Accueil non réactif EmptySam 11 Fév 2023, 06:04 par Krager

-48%
Le deal à ne pas rater :
Philips Hue Pack Decouverte 2024 : lightstrip 3M + ampoules E27 X2 + ...
119 € 229 €
Voir le deal

Partagez
 

Onglets à gauche/Accueil non réactif

Voir le sujet précédent Voir le sujet suivant Aller en bas 
http://www.lovely-emily.com
£ly
£ly
{ Membre }
{ Membre }

Féminin Messages : 32



Onglets à gauche/Accueil non réactif Empty
Bonjour enfin à cette heure bonsoir serait plus approprié Very Happy

Afin d'innover pour la prochaine version d'un de mes fo' qui va fêter ses 1 an
je voulais mettre, comme on le voit sur beaucoup, une PA avec des onglets, évidemment personnalisée à mon gout.

Je voudrais savoir quel est le code à rajouter pour que les onglets soit à gauche.
J'ai essayé position, clear et float sans résultat =)


Et puis mon autre question...
Tout va bien jusqu'à ce que je renomme les onglets, et là paf, c'est la cata.

En changeant le nom des onglets, plus rien ne marchait. J'ai remodifié un truc et ça marchait à nouveau. Maintenant le problème c'est que les deux derniers onglets fonctionnent comme il faut. . Cependant l'onglet "accueil" ne réagit plus Shocked

Voilà le code html :

Code:

<body>
        <div class="systeme_onglets">
        <div class="onglets">
            <span class="onglet_0 onglet" id="onglet_accueil" onmouseover="javascript:change_onglet('_accueil_');">Accueil</span>
            <span class="onglet_0 onglet" id="onglet_news" onmouseover="javascript:change_onglet('news');">Stay in touch</span>
            <span class="onglet_0 onglet" id="onglet_friendship" onmouseover="javascript:change_onglet('friendship');">Friendship</span>
        </div>
        <div class="contenu_onglets">
            <div class="contenu_onglet" id="contenu_onglet_accueil">
               
            Salut salut
            </div>
            <div class="contenu_onglet" id="contenu_onglet_news">
                Les dernières news du fo'
            </div>
            <div class="contenu_onglet" id="contenu_onglet_friendship">
                Wanna be friend ?
            </div>
        </div>
    </div>
    <script type="text/javascript">
        //<!--
                var anc_onglet = 'accueil';
                change_onglet(anc_onglet);
        //-->
        </script>
</body>


J'ai fait une bourde, mais je sais pas où Surprised
MessageSujet: Onglets à gauche/Accueil non réactif   Onglets à gauche/Accueil non réactif EmptyMar 01 Juin 2010, 18:19
Revenir en haut Aller en bas
Invité
Invité




Onglets à gauche/Accueil non réactif Empty
Bonjour,

Votre problème est toujours d'actualité ?
MessageSujet: Re: Onglets à gauche/Accueil non réactif   Onglets à gauche/Accueil non réactif EmptyDim 06 Juin 2010, 09:41
Revenir en haut Aller en bas
http://www.lovely-emily.com
£ly
£ly
{ Membre }
{ Membre }

Féminin Messages : 32



Onglets à gauche/Accueil non réactif Empty
Oui ^^
MessageSujet: Re: Onglets à gauche/Accueil non réactif   Onglets à gauche/Accueil non réactif EmptyLun 07 Juin 2010, 10:00
Revenir en haut Aller en bas
http://zonescript.forumactif.fr
VPeybernes
{ Membre actif }
{ Membre actif }

Masculin Messages : 563



Onglets à gauche/Accueil non réactif Empty
Bonjour.
Pourrait t'on voir le script ?

Pour le problème avec l'accueil, je pense que c'est à cause du '_accueil_' au lieux de 'accueil'.
Il faut enlever body aussi.
MessageSujet: Re: Onglets à gauche/Accueil non réactif   Onglets à gauche/Accueil non réactif EmptyLun 07 Juin 2010, 14:40
Revenir en haut Aller en bas
http://www.lovely-emily.com
£ly
£ly
{ Membre }
{ Membre }

Féminin Messages : 32



Onglets à gauche/Accueil non réactif Empty
Le script c'est celui ci http://www.supportduweb.com/scripts_tutoriaux-code-source-48-systeme-d-onglets-en-javascript-x-html-et-css-dans-la-meme-page.html Que j'ai modifié à mon gout.
J'ai change le "accueil", ça marche à nouveau , merci ^^
MessageSujet: Re: Onglets à gauche/Accueil non réactif   Onglets à gauche/Accueil non réactif EmptyMer 09 Juin 2010, 09:36
Revenir en haut Aller en bas
http://zonescript.forumactif.fr
VPeybernes
{ Membre actif }
{ Membre actif }

Masculin Messages : 563



Onglets à gauche/Accueil non réactif Empty
Pour le positionnement des onglet, aves vous tester text-align: left; sur #onglets tout simplement ?

Quand je te demandez le script, c'est le tiens qui m'intéresse. Le tuto je m'en fiche.
MessageSujet: Re: Onglets à gauche/Accueil non réactif   Onglets à gauche/Accueil non réactif EmptyMer 09 Juin 2010, 13:26
Revenir en haut Aller en bas
http://www.lovely-emily.com
£ly
£ly
{ Membre }
{ Membre }

Féminin Messages : 32



Onglets à gauche/Accueil non réactif Empty
Oui j'avais testé avec le text-align, mais sans résultat, testé avec les position, absolute, fixed ect...

Voilà mon script :
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
        {
font-size: 18px;
                display:inline-block;
                margin-left:5px;
                margin-right5px;
margin-top: -2px;
                padding:5px;
 
                cursor:se-resize;
-moz-border-radius-topright: 10px ;
-moz-border-radius-bottomleft: 15px ;
        }
        .onglet_0
        {
                background:#dddddd;
font-size: 18px;
-moz-border-radius-topright: 10px ;
-moz-border-radius-bottomleft: 15px ;
        }
        .onglet_1
        {
                background:#dddddd;
                border-bottom:0px solid black;
                padding-bottom:5px;
-moz-border-radius-topright: 10px ;
-moz-border-radius-bottomleft: 15px ;
font-size: 18px;
        }
        .contenu_onglet
        {
                background-color:#dddddd;
    font-size: 14px;
                margin-top:10px;
                padding:10px;
                display:none;
-moz-border-radius : 10px ;

        }
        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_accueil" onmouseover="javascript:change_onglet('accueil');">Accueil</span>
            <span class="onglet_0 onglet" id="onglet_news" onmouseover="javascript:change_onglet('news');">Stay in touch</span>
            <span class="onglet_0 onglet" id="onglet_friendship" onmouseover="javascript:change_onglet('friendship');">Friendship</span>
        </div>
        <div class="contenu_onglets">
            <div class="contenu_onglet" id="contenu_onglet_accueil">
               
            Salut salut
            </div>
            <div class="contenu_onglet" id="contenu_onglet_news">
                <h1>Qui?</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_friendship">
                <h1>Pourquoi?</h1>
                Pour simplifier la navigation et la diviser en parties
            </div>
        </div>
    </div>
    <script type="text/javascript">
        //<!--
                var anc_onglet = 'accueil';
                change_onglet(anc_onglet);
        //-->
        </script>
</body>
</html>
MessageSujet: Re: Onglets à gauche/Accueil non réactif   Onglets à gauche/Accueil non réactif EmptyMer 09 Juin 2010, 16:32
Revenir en haut Aller en bas
http://zonescript.forumactif.fr
VPeybernes
{ Membre actif }
{ Membre actif }

Masculin Messages : 563



Onglets à gauche/Accueil non réactif Empty
Tu es sûr ?
Parce que je viens de le faire et ça marche très bien.

Attention au fautes, ya un s dans ta classe .onglets et pas .onglet
MessageSujet: Re: Onglets à gauche/Accueil non réactif   Onglets à gauche/Accueil non réactif EmptyMer 09 Juin 2010, 19:45
Revenir en haut Aller en bas
http://www.lovely-emily.com
£ly
£ly
{ Membre }
{ Membre }

Féminin Messages : 32



Onglets à gauche/Accueil non réactif Empty
En mettant le code sur une page html ça marche, mais pas dans la PA, sans doute a cause de ma feuille css. Vu que j'ai mis le code sur un de mes autres forums en essai c'est pour ça, ça intervient avec le code pour le menu que j'ai bloqué en haut. Donc mon problème est réglé, merci ^^
MessageSujet: Re: Onglets à gauche/Accueil non réactif   Onglets à gauche/Accueil non réactif EmptyMer 09 Juin 2010, 20:43
Revenir en haut Aller en bas
Contenu sponsorisé




Onglets à gauche/Accueil non réactif Empty
MessageSujet: Re: Onglets à gauche/Accueil non réactif   Onglets à gauche/Accueil non réactif Empty
Revenir en haut Aller en bas
 

Onglets à gauche/Accueil non réactif

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

 Sujets similaires

-
» Onglets Page d'Accueil
» Onglets dans la page d'accueil
» Inclusion d'un header et d'un tableau à onglets dans le premier onglet d'une navigation à onglets
» [résolu] Sur l'accueil = remplacer des liens par des onglets
» Problème d'onglets sur Page d'accueil [Résolu]

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
CSSActif :: De la théorie à la pratique :: Aide CSS & xHTML :: Problèmes résolus-

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