IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Switch div visibility (edit)


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre confirmé
    Profil pro
    Inscrit en
    Août 2006
    Messages
    80
    Détails du profil
    Informations personnelles :
    Localisation : Belgique

    Informations forums :
    Inscription : Août 2006
    Messages : 80
    Par défaut Switch div visibility (edit)
    Bonjour,

    J'ai une petite fonction javascript qui me permet de switch la visibilité d'une div.
    A l'initialisation les div sont en 'style="display:none" '.

    Mon problème est que, une fois la page chargée, lorsque ma fonction est appelée la première fois, c'est comme s'il appelait ma fonction deux fois de suite.

    La div apparait un quart de seconde, et ensuite se remet en non visible.
    Une fois qu'une div a eu ce problème, après ça fonctionne pour celle la.
    Si je recharge la page, le problème revient biensur.
    Mais ce n'est vraiment qu'au premier clic, pour chaque div...

    Je fais ça dans le cadre du travail, et je ne peut tester uniquement sur internet explorer 6, le problème vient peut être de la...


    en gros je travaille comme ça :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
     
    <a name="elem1"/>
    <a href="#elem1" onclick="toggleDiv('elem1.div')">Switch</a>
    <div name="elem1.div" style="display:none">
       ...
    </div>

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
     
    function toggleDiv(divname)
    {
        var d = document.getElementById(divname);
        if (d.style.display == 'block')
        {
            d.style.display = 'none';
        }
        else
        {
            d.style.display = 'block';
        }
    }
    Merci

    Yannick

  2. #2
    Expert confirmé
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 660
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 660
    Par défaut
    bonjour,

    essaye cette syntaxe :
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
     
    <a name="elem1" href="#elem1" onclick="toggleDiv('elem1_div')">Switch</a>
    <div id="elem1_div" style="display:none">
       ...
    </div>

    dans ton code JS tu utilises getElementById() il faut donc que ton élément posède l'attribut id (et pas name). De plus, je ne mettrais pas de point dans la valeur de l'id.

    Quant à la syntaxe :
    elle n'est pas valide

  3. #3
    Membre confirmé
    Profil pro
    Inscrit en
    Août 2006
    Messages
    80
    Détails du profil
    Informations personnelles :
    Localisation : Belgique

    Informations forums :
    Inscription : Août 2006
    Messages : 80
    Par défaut
    Merci de la réponse,

    Pour le le lien vers une anchor, c'est vrai que ta méthode est plus propre.
    Je ne pense pas que l'erreur venait du ".".
    L'attribut id de la div, je m'étais en fait trompé en écrivant le message, je l'utilisais...

    J'ai fais quelques modifs, et en fait le problème que je décris ne se manifeste qu'une seule fois pour toute la page, et non une fois pour chaque div comme je le disais.

    Donc voila, dans mon html maintenant j'ai ceci :
    Cette partie ci ne génère pas le problème
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
     
    <a name="Network" href="#Network" onclick="toggleDiv('Network_div')">Network</a>
    <div id="Network_div" style="display:none">
    </div>
    Celle ci par contre....
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
     
    <a name="Network" href="#Network" onclick="toggleDiv('Network_div')">
    <span style="color: #DD0000;">Network</span>
    </a>
    <div id="Network_div" class="mrs" style="display:none">
    </div>
    A part le span et l'attribut class, rien ne change, et l'erreur ne vient pas de la.

    Merci

  4. #4
    Expert confirmé
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 660
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 660
    Par défaut
    pas de span dans la balise <a>

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
     
    <a style="color: #DD0000;" name="Network" href="#Network" onclick="toggleDiv('Network_div')">Network
    </a>
    est-ce que les id dans ta page sont uniques ?

  5. #5
    Membre confirmé
    Profil pro
    Inscrit en
    Août 2006
    Messages
    80
    Détails du profil
    Informations personnelles :
    Localisation : Belgique

    Informations forums :
    Inscription : Août 2006
    Messages : 80
    Par défaut
    oui oui, ils sont uniques...

    D'ailleurs, ça fonctionne bien, a partir du moment ou l'erreur s'est déclenchée une fois (donc double toggle : none -> block & block -> none)

    Après ça, tout va bien, c'est ce que je comprends pas, le problème doit être au niveau du chargement je suppose.

    J'ai essayé sans le span, ça revient au même

  6. #6
    Expert confirmé
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 660
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 660
    Par défaut
    ton problème est curieux, tu peux me montrer le code de ta page ?

Discussions similaires

  1. [AJAX] Rafraichissement d'une div "visible" malheureusement
    Par toufou dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 18/02/2009, 10h33
  2. Div visible ou hidden / Display none
    Par HWICE dans le forum Général JavaScript
    Réponses: 9
    Dernier message: 15/08/2008, 16h47
  3. rendre un DIV visible à la fermeture d'une pop-up
    Par Peanut dans le forum Général JavaScript
    Réponses: 11
    Dernier message: 03/01/2008, 16h17
  4. Div visibility hidden / visible ne marche pas sous IE ?
    Par nebule dans le forum Général JavaScript
    Réponses: 5
    Dernier message: 28/11/2007, 16h20
  5. [Css] Double div visible / hidden pour créer un background transparent.
    Par hazardous_material dans le forum Mise en page CSS
    Réponses: 1
    Dernier message: 26/07/2006, 17h41

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo