Fonction afficher / masquerRésolu

Question

Bonjour, Sur mon site, j'aimerai pouvoir afficher ou "enlever" un texte quand l'utilisateur clique sur le titre de ce texte j'ai trouvé une fonction sur le net qui marche bien pour l'affichage : /*function montre_div(nom_div) { document.getElementById(nom_div).style.display="block"; }*/ J'ai voulu modifier la fonction afin que quand l'utilisateur reclique sur le titre du texte le texte puisse disparaitre, mais ça ne marche pas! Quelqu'un pourrait-il m'aider? ! Voilà ma fonction

Bul3 · Accepted Answer

oui, oui... mais le reste ?

titre

src

sous réserve de ce qu génère le PHP ! qui peut être faux ! j'ai remplacé pour les tests, par une valeur directe. [mon Site][M'écrire]Bul et quand tu auras pigé tu remplaces =="none" par !="block" par exemple puisqu'au moins 3 solutions....

Bul3 · Answer

bonjour,

c'est bien de nous donner la fonction,
elle doit d'ailleurs fonctionner pour afficher/cacher
mais... où est le div ? comment appelle-t-on cette fonction ? quand ?
je veux bien taper ce qu'il faut même sit ce serait plus sympa de
nous le donner.... non ?, mais en plus, cela correspondra-t-il a ce que tu as ?
et, mon foie, autant l'avoir plutôt que de faire pour rien.
et pas 26658975 lignes ! le div + l'appel : 5 lignes quoi... et encore...
mais met tout et en forme si tu veux bien, que nous ne soyons pas obligé de le faire

Cordialement          [mon Site] [M'écrire] Bul

didygwatinik · Answer

Donc la fonction est ici-même : Voici l'appel à ma foncion :

Voilà j'espère que c'est assez clair.

Bul3 · Answer

y'aurait pas du php là ?
et comment on devine ce que ça génère ? 

bon ici, ce n'est pas important ( peut-être !?! )
mais si tu avais d'autres soucis, c'est la page html résultante
       qu'il faut mettre ! pas le php... on n'est pas devin.

 if(document.getElementById(nom_div).style.display=="none")

 c'est un test, = une affectation.

et... ça marche si le css n'est pas présent :
le li_1 est caché au départ, et son style.display n'est pas = none !

soit tu testes "le style actuel"  pour la balise, 
soit tu lui met style="display:none",
soit tu testes !="block"

          [mon Site] [M'écrire] Bul

didygwatinik · Answer

Euh, j'ai pas très bien compris, enfin ce que j'ai compris c'est qu'il faut que j'enlève le CSS? Et ensuite ma fonction devient : C'est ça????

Bul3 · Answer

à priori la fonction serait ok.. mais :
tu testes le style.display de la balise li_1.
quel est-il ??? indéfini ( la 1ère fois )
pas "none" ou "block", en tous cas : tu n'as rien mis
de tel dans le style de la balise.

sans le ccs, la balise est affichée.
    la 1ère fois que tu appelles  la fonction, style.display
       n'est pas = "none", donc on le met à "none"

avec le css, la balise est cachée,
    la 1ère fois que tu appelles  la fonction, style.display
       n'est pas = "none", donc on le met à "none"

les autres appels, seront ok

3 possibilités de rectifier :
soit tu testes "le style actuel" (currentStyle de mémoire
mais pas sûr que IE et FF soient d'accord ! ) pour la balise,
soit tu met style="display:none" à la balise
soit tu testes !="block"

css ou pas.

est-ce plus clair ?
mais.. teste, tu verras...

Bul3 · Answer

enfin... quand je disais : "3 possibilités de rectifier"
c'était celles qui me sont venues sur le coup, doit bien y en avoir 356987 autres
[mon Site][M'écrire]Bul

didygwatinik · Answer

Ah non! je suis vraiment pomée là. Je comprends pas grand chose, au début , le style du display est bien à none vu qu'avec le CSS, on a : Avec ceci, j'ai ma fonction : Et l'appel à la fonction est comme tout à l'heure :

J'ai essayé le display:none que j'ai ajouté à ma balise mas ça efface le Afficher que j'ai avant. Est-ce que vous pourriez me modifier le code, s'il vous plait parce que je patauge un peu. ?>

Bul3 · Answer

>>style du display est bien à none vu qu'avec le CSS, on a : 
ben non !
le css dans la balise style ce n'est pas le style de la balise !

mais essaye donc,
ta fonction + <style> + le html

tu verras que tu es obligé de cliqer 2 fois pour cacher, la 1ère fois.

fais donc un alert(document.getElementById(nom_div).style.display)
en tête de la fonction.

          [mon Site] [M'écrire] Bul

didygwatinik · Answer

Je dois vraiment coder comme un pied! Mon alert, ne fonctionne même pas. Ma fonction doit bien ressembler à ça :

didygwatinik · Answer

AAHHHHHHH ça marche!
Pour le code c'est OK! Si j'ai bien compris, au début on a rien dans le display donc, il passe à none et c'est à partir de là une fois qu'on reclique dessus qu'il passe à block?!
Faut que je sois sure d'avoir bien compris.

@karamel · Answer

bonjour j'en ai aussi une possibilite si on part du principe que au de part le style = none on pourait garder la fonction tel quel et rajouter une variablede teste pour le demmarage de la fonction et la on pourait garder le css ca donnerait ca var test = 1

Bul3 · Answer

ça doit fonctionner
mais pourquoi ajouter une variable ???

teste !="block" à la place de =="none" comme je te le proposais !

[mon Site][M'écrire]Bul

@karamel · Answer

j'ajoute une variable pour le premier clic ensuite la variable se met a deux sa evite au depart de faire un if document.getElementById(nom_div).style.display=="none" qui si je ne me trompe pas et si on utilise une feuille de style me retournera une erreur lors du premier click car de memoire document.getElementById(nom_div).style me retourne tous ce qui se trouve dans la ba lise style et pas se qui se trouve dans le css plus besoin de mettre une balise <style='display:none'>et pas besoin aussi d'utilise currentStyle et getComputedStyle

Bul3 · Answer

répèterais-je ??  fait          if (document.getElementById(nom_div).style.display!="block")
   [mon Site][M'écrire] Bul

PetoleTeam · Answer

Bonjour, 
comme dans 99,9% des cas le but est de 
faire apparaître au premier click, la solution de TheBul3 reste la plus propre à savoir 
//--------------------------- 
function 
montre_div( nom_div){ 
  var Obj = document.getElementById(nom_div); 

  if( Obj){ 
    if( Obj.style.display != "block") 

      Obj.style.display="block"; 
    else{ 

      Obj.style.display="none"; 
    } 
  } 
}
...comme 
cela pas besoin de se poser la question quant à savoir si on met un display:none dans la BALISE ou dans la partie 
STYLE... 

Ceci étant un nom plus approprié devrait être donnée à cette 
fonction qui affiche/cache en alternace. 
;O)

Fonction afficher / masquer

16 réponses

Votre réponse

Discussions similaires