Faire Apparaitre et disparaitre en un click

WRInaute occasionnel
Bonjour,
je cherche un petit script fluide qui pourrait m'aider dans mon développement de site.

Par exemple j'ai 3 parties principales :

1 OBJET
2 DEFINITIONS
3 SOUSCRIPTION

et quand l'utilisateur click sur DEFINITIONS op le 3 SOUSCRITION s'abaisse pour laisser place au contenu de DEFINITIONS

Une méthode la plus référencable... JS ? PHP ?

Merci d'avance
 
WRInaute accro
tres simple :
tu mets le contenu de souscriptions dans un div que tu nomme comme tu veux (ex : id=toto) que tu met en style : display:none
idem pour les deux autres

et sur clic de definitions, tu appelles un js qui met style.display:none aux deux autres et display:yes a celui là
 
WRInaute occasionnel
Code:
<script>
  function show() {
    document.getElementById('toto').style.display = 'block';
  }
</script>

<a href='javascript: show()'>Affiches-moi</a><br>

<div style='display:none;' id='toto'> <!-- toto est une idée d'e-kiwi -->
Mon Contenu caché
</div>

Voilà... pas testé, mais ça doit jouer...
 
WRInaute discret
Et pour que l'utilisateur puisse refermer le DIV "toto":
Code:
function vaEtVient() /* sans jeux de mot, difficile d'éviter les anglicismes ;) */
{
   if(document.getElementById('toto').style.display == '') 
  {
    document.getElementById('toto').style.display = 'block';
  }
  else
 {
    document.getElementById('toto').style.display = '';
 }
}

C'est un peu plus compliqué si tu veux que l'ouverture d'un sous menu provoque la fermeture de celui qui est déjà ouvert (et en terme d'ergonomie, c'est assez déstabilisant pour l'utilisateur qui ne sait plus ou il en est dans ton menu...mais ça c'est une autre histoire...)
 
WRInaute occasionnel
nexxen a dit:
Et pour que l'utilisateur puisse refermer le DIV "toto":
function vaEtVient() /* sans jeux de mot, difficile d'éviter les anglicismes ;) */
{
if(document.getElementById('toto').style.display == 'none')
{
document.getElementById('toto').style.display = 'block';
}
else
{
document.getElementById('toto').style.display = 'none';
}
}

C'est un peu plus compliqué si tu veux que l'ouverture d'un sous menu provoque la fermeture de celui qui est déjà ouvert (et en terme d'ergonomie, c'est assez déstabilisant pour l'utilisateur qui ne sait plus ou il en est dans ton menu...mais ça c'est une autre histoire...)

juste oublié 2 petites nones (pour éviter les anglicismes :wink: )... et ça doit jouer
 
WRInaute discret
biscuit a dit:
juste oublié 2 petites nones (pour éviter les anglicismes Wink )... et ça doit jouer

:lol: effectivement c'est mieux comme ça!

Par contre, si le menu doit être fermé par défaut, au chargement de la page, et que ce comportement soit assuré par les CSS (#toto {display: none; ...}), je crois que la propriété style.display ne sera pas renseignée (il faudrait cliqué 2 fois pour faire apparaitre le sous-menu). Pour éviter ce pb le test doit se faire sur les 2 valeurs none et '' (vide) :

Code:
if(document.getElementById('toto').style.display == 'none' || document.getElementById('toto').style.display == '') { ...}
 
Discussions similaires
Haut