11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous, je suis débutant en langage 'javascript' et j'aurais besoin de quelques lumières pour réaliser un menu dépliant répondant à mes besoins.

1ère étape : Ce que j'ai déjà
Je souhaite intégrer à une page html, un menu dépliant, sous forme de liste.
Au clic d'une rubrique, je souhaite afficher un bloc texte.
Exemple d'une liste par défaut :
> rubrique 1
> rubrique 2
> etc...
Exemple au clic sur la rubrique 1 :
> rubrique 1
Texte de la rubrique 1
>rubrique 2
> etc...

Voici mon bout de code (trouvé sur internet) :
--------------------------
function Swap( div_){
  var Obj = document.getElementById( div_);
  if( Obj){
    if( Obj.style.display=="")
      Obj.style.display="none";
    else
      Obj.style.display="";
  }
}

<a href="#" onclick="Swap('DIV_1');">Rubrique 1</a>
<div id="DIV_1" style="display:none; padding-left:10px;">
Ceci est le Texte de la Rubrique 1<br>
</div>
<br>
<br>
<a href="#" onclick="Swap('DIV_2');">Rubrique 2</a>
<div id="DIV_2" style="display:none; padding-left:20px">
Ceci est le Texte de la Rubrique 2
</div>

------------------------

2ème étape : ce qu'il me manque
J'ai besoin d'un script me permettant de fermer une rubrique ouverte lors d'un clic sur une autre rubrique.
Exemple :
on a :
> rubrique 1
texte de la rubrique 1
> rubrique 2
> rubrique 3

et on clique sur la rubrique 3 (par exemple), et on obtient :
> rubrique 1
> rubrique 2
> rubrique 3
texte de la rubrique 3

Voilà, j'espère avoir été assez clair dans mon explication, et j'espère que vous pourrez m'aider.

Merci d'avance.
Modifié par Aliam (16 Sep 2009 - 19:54)
Bonjour et bienvenue parmi nous Smiley smile

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle. Smiley cligne

D'ailleurs, je rappelle que le lien qui apparaît en bandeau tout en haut du forum ("Nouveau sur le forum ?...") est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.

Bonne continuation Smiley smile

upload/1-code.gif
Oops !
Je viens d'arranger cela, excusez moi encore de la gêne occasionnée.

Concernant les recherches, j'ai bien trouvé des fils sur ce forum traitant des menus dépliants et déroulants, mais je n'ai pas trouvé à l'intérieur de réponse me concernant Smiley ohwell

Personne n'aurait d'idée, ou bien d'exemple à me montrer, quitte à ce que je change de code pour l'affichage des rubriques ?
Modifié par Aliam (15 Sep 2009 - 15:39)
j'ai résolu mon problème en utilisant les fonctions onmouseover et onmouseout.

Ce n'est pas vraiment la solution que j'espérais, donc si quelqu'un pouvait m'en fournir une qui marche avec le onclick ?

Merci d'avance.