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 :

Afficher, cacher plusieurs divs


Sujet :

JavaScript

  1. #1
    Candidat au Club
    Inscrit en
    Mars 2004
    Messages
    3
    Détails du profil
    Informations forums :
    Inscription : Mars 2004
    Messages : 3
    Points : 2
    Points
    2
    Par défaut Afficher, cacher plusieurs divs
    Salut,

    Voilà, j'ai trouvé un script assez intéressant pour afficher et cacher des objets "div"

    Le script de base se présente ainsi :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    <script language="javascript">
    <!--
    var state = 'hidden';
     
    function showhide(layer_ref) {
     
    if (state == 'visible') {
    state = 'hidden';
    }
    else {
    state = 'visible';
    }
    if (document.all) { //IS IE 4 or 5 (or 6 beta)
    eval( "document.all." + layer_ref + ".style.visibility = state");
    }
    if (document.layers) { //IS NETSCAPE 4 or below
    document.layers[layer_ref].visibility = state;
    }
    if (document.getElementById && !document.all) {
    tutu = document.getElementById(layer_ref);
    tutu.style.visibility = state;
    }
    }
     
    //-->
    </script>
    Le html est :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
     
    <body>
    <a href="#" onclick="showall('toto');">show all</a>
    <a href="#" onclick="closeall('toto');">close all</a>
    <a href="#" onclick="showhide('agent99');">click me</a>
    <div id="agent99" style="position:absolute; top:103px; left:153px;
    visibility:hidden;">
    your stuff to show here
    <a href="javascript://" onclick="showhide('agent99');">click me</a>
    </div>
    <br>
    <br>
     
    <a href="javascript://" onclick="showhide('toto');">click toto</a><br>
    <div id="toto" style="visibility:hidden;">blux<a href="javascript://" onclick="showhide('toto');">click me</a>
    </div>
     
     
    </body>
    Toutefois, j'aimerais bien pouvoir ouvrir/fermer plusieurs "divs" à la fois.
    J'ai donc tenté de créer 2 fonctions "showall" et "closeall" :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    function showall(layer_ref) {
     
    if (state == 'visible') {
    state = 'visible';
    }
    else {
    state = 'visible';
    }
    if (document.all) { //IS IE 4 or 5 (or 6 beta)
    eval( "document.all." + layer_ref + ".style.visibility = state");
    }
    if (document.layers) { //IS NETSCAPE 4 or below
    document.layers[layer_ref].visibility = state;
    }
    if (document.getElementById && !document.all) {
    tutu = document.getElementById(layer_ref);
    tutu.style.visibility = state;
    }
    }
     
    function closeall(layer_ref) {
     
    if (state == 'visible') {
    state = 'hidden';
    }
    else {
    state = 'hidden';
    }
    if (document.all) { //IS IE 4 or 5 (or 6 beta)
    eval( "document.all." + layer_ref + ".style.visibility = state");
    }
    if (document.layers) { //IS NETSCAPE 4 or below
    document.layers[layer_ref].visibility = state;
    }
    if (document.getElementById && !document.all) {
    tutu = document.getElementById(layer_ref);
    tutu.style.visibility = state;
    }
    }
    Malheureusement, ça ne fonctionne pas trop bien.....
    L'un d'entre vous aurait-il une idée ?
    Merci beaucoup

  2. #2
    Membre émérite
    Inscrit en
    Septembre 2002
    Messages
    2 307
    Détails du profil
    Informations forums :
    Inscription : Septembre 2002
    Messages : 2 307
    Points : 2 814
    Points
    2 814
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
     
    function showall()
    {
    show("toto");
    show("agent99");
    }
    function closeall()
    {
    close("toto");
    close("agent99");
    }
    function show(layer_ref) { 
    if (document.all) { //IS IE 4 or 5 (or 6 beta) 
    eval( "document.all." + layer_ref + ".style.visibility = 'visible'"); 
    } 
    if (document.layers) { //IS NETSCAPE 4 or below 
    document.layers[layer_ref].visibility = 'visible'; 
    } 
    if (document.getElementById && !document.all) { 
    tutu = document.getElementById(layer_ref); 
    tutu.style.visibility = 'visible'; 
    } 
    } 
     
    function close(layer_ref) {  
     
    if (document.all) { //IS IE 4 or 5 (or 6 beta) 
    eval( "document.all." + layer_ref + ".style.visibility = 'hidden'"); 
    } 
    if (document.layers) { //IS NETSCAPE 4 or below 
    document.layers[layer_ref].visibility = 'hidden'; 
    } 
    if (document.getElementById && !document.all) { 
    tutu = document.getElementById(layer_ref); 
    tutu.style.visibility = 'hidden'; 
    } 
    }

  3. #3
    Candidat au Club
    Inscrit en
    Mars 2004
    Messages
    3
    Détails du profil
    Informations forums :
    Inscription : Mars 2004
    Messages : 3
    Points : 2
    Points
    2
    Par défaut
    Merci Matthieu
    Mais je perds au passage une fonctionnalité importante pour moi :
    la fonction "showhide". Mon but est qu'un seul lien permette d'ouvrir et de fermer un div.

    Ce qui donnerait un truc dans le genre :

    1. Lien ouvrir/fermer (fonction showclose)
    2. Lien tout ouvrir (fonction showall)
    3. Lien tout fermer (fonction closeall)

    Comment faire :
    Merci encore

  4. #4
    Membre émérite
    Inscrit en
    Septembre 2002
    Messages
    2 307
    Détails du profil
    Informations forums :
    Inscription : Septembre 2002
    Messages : 2 307
    Points : 2 814
    Points
    2 814
    Par défaut
    la fonction showhide marche à un clic près!
    un peu de mofie...
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
     
    function showhide(layer_ref) { 
     
    if (document.all) { //IS IE 4 or 5 (or 6 beta) 
    state =  eval( "document.all." + layer_ref + ".style.visibility "); 
    } 
    if (document.layers) { //IS NETSCAPE 4 or below 
    state = document.layers[layer_ref].visibility ; 
    } 
    if (document.getElementById && !document.all) { 
    state =  document.getElementById(layer_ref).style.visibility; 
    } 
     
    state = (state == 'visible')?'hidden': 'visible'; 
     
    if (document.all) { //IS IE 4 or 5 (or 6 beta) 
    eval( "document.all." + layer_ref + ".style.visibility = state"); 
    } 
    if (document.layers) { //IS NETSCAPE 4 or below 
    document.layers[layer_ref].visibility = state; 
    } 
    if (document.getElementById && !document.all) { 
    tutu = document.getElementById(layer_ref); 
    tutu.style.visibility = state; 
    } 
    }

  5. #5
    Candidat au Club
    Inscrit en
    Mars 2004
    Messages
    3
    Détails du profil
    Informations forums :
    Inscription : Mars 2004
    Messages : 3
    Points : 2
    Points
    2
    Par défaut
    La classe !!! 8)
    Tout fonctionne parfaitement !
    Merci beaucoup pour ton aide

    [Tag "Résolu" ajouté par Gaara]

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Afficher/cacher plusieurs div en même temps
    Par Mauno dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 27/08/2010, 19h24
  2. Afficher / Cacher des divs
    Par figatelliSTI dans le forum Général JavaScript
    Réponses: 5
    Dernier message: 03/04/2008, 16h57
  3. afficher cacher un div
    Par Alex35 dans le forum Général JavaScript
    Réponses: 13
    Dernier message: 26/10/2007, 11h34
  4. Afficher / Cacher une Div contenant un slider
    Par KrusK dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 10/07/2007, 14h53

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