Plusieurs menus slidedown dans une même page [Résolu]

[gilles11]

Bonjour,

Je souhaite implémenter plusieurs menus js identiques (vertical, rétractable, 3 niveaux) dans une même page html.
J'ai trouvé deux menus qui correspondent exactement à ce que je souhaite mettre en place sur mon site:
- Radmenu
- Slidedown menu

Dans les deux exemples, je me retrouve confronté au même problème, si j'insère deux ou plusieurs menus dans la même page, seul le premier menu fonctionne.

Comment dois je m'y prendre pour faire cohabiter des menus qui utilisent le même script js dans la même page?

Mes seules connaissances en langage web sont le php, sql et html. Je n'ai pas assez de temps libre pour découvrir le Javascript. J'espère que vous pourrez m'aider sur ce problème d'implémentation spécifique.

[NoSmoking]

Bonjour,

Je souhaite implémenter plusieurs menus js identiques (vertical, rétractable, 3 niveaux) dans une même page html.

l'ergonomie et l'accessibilité risque d'en pâtir !

Sans avoir regardé plus avant, vérifies quand même que tu n'as pas des ID identiques sur tes menus.

[gilles11]

Le code associé à l'instance du menu radmenu est le suivant:

Code :

1
2
3
4
5
  <!-- Create Menu Settings: (Menu ID, Is Vertical, Show Timer, Hide Timer, On Click ('all' or 'lev2'), Right to Left, Horizontal Subs, Flush Left, Flush Top) --><script type="text/javascript">
//<![CDATA[
rad_create(0,false,0,500,'all',false,false,false,false);
//]]>
</script>

J'ai testé d'ajouter la ligne

Code :

rad_create (1,false,0,500,'all',false,false,false,false);

et d'insérer ensuite dans la page html un nouveau menu, cela n'a pas fonctionné.

Je ne comprend pas sur quelle balise html cette ID fait référence.
J'ai bien essayé de remplacer
<ul id="rad0" class="radmc"><li> par <ul id="rad1" class="radmc"><li> mais cela n'a pas mieux réussi.

l'ergonomie et l'accessibilité risque d'en pâtir !

Le menu concerné (radmenu) est situé dans la sidebar mon site web (cf. Index des Auteurs) que vous pouvez visiter ici : http://www.je-mattarde.com/

En cliquant sur les différents icônes, on peut afficher selon:
- le menu des Auteurs
- le menu des Réalisateurs
- le menu des Artistes

J'utilise actuellement la méthode GET, la page est réactualisée en cliquant sur un des 3 icônes, et une nouvelle requête remplit le menu en fonction de l'indexation choisie (Auteurs, ou Réalisateurs, ou Artistes).

Une seule requête sql suffirait en mettant un menu différent dans un système d'onglet (un onglet = un menu radmenu).
Le système d'onglet remplacerait alors la requête html GET qui réactualise, pour peu de chose, toute la page.

(Seulement si j'arrive à faire fonctionner trois menus dynamiques sur la même page.)

[NoSmoking]

ah! j'ai eu peur que tu ais trois type de menu sur la même page

tu dois te retrouver avec une structure du genre

Code html :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!-- 1st menu -->
<div id="rad0">
  <ul>
    <li></li>
    <li></li>
  </ul>
</div>
<!-- 2nd menu -->
<div id="rad1">
  <ul>
    <li></li>
    <li></li>
  </ul>
</div>
<!-- 3th menu -->
<div id="rad2">
  <ul>
    <li></li>
   <li></li>
  </ul>
</div>

et faire une initialisation pour chacun de tes menus

Code :

1
2
3
rad_create (0,false,0,500,'all',false,false,false,false);
rad_create (1,false,0,500,'all',false,false,false,false);
rad_create (2,false,0,500,'all',false,false,false,false);

ensuite il s'agit de gérer sur le click des images le masquage/affichage des différents menus.

[gilles11]

C'est bien une structure dans ce genre.

Seulement, ça ne fonctionne pas.

J'ai effectivement changer l'ID de la premier balise <ul id="rad#"> de mes 3 menus radmenu, ET je n'oublie pas de les initialiser indépendamment. Seul le premier menu de la page fonctionne. (Je n'ai rien d'autres sur ma page de test que le code html associé à ces menus qui puissent générer une erreur). Je pense que ce n'est peut-être pas la bonne façon de faire.

[NoSmoking]

peut-on avoir l'adresse de la page test...

[gilles11]

Voici ma page de test:
http://www.je-mattarde.com/TEST/INDEX.html#


[EDIT]

Je viens de trouver l'origine de ce menu, cela devrait beaucoup m'aider: http://www.mycssmenu.com/visual_inte.../template.html

[NoSmoking]

de ce que j'ai pu voir dans ton fichier test tu ne peux initialiser qu'un et un seul menu.

J'ai également vu que tu utilisais jQuery, ce doit bien être le diable si tu ne trouve pas un plugin répondant à ton besoin.

[gilles11]

oui, en tout cas merci de ton aide.

[fab256]

Regarde cet exemple en JQuery d'un menu accordion, le code source est ici
D'ailleurs dans l'exemple il y'a deux menus.

[gilles11]

Regarde cet exemple en JQuery d'un menu accordion, le code source est ici
D'ailleurs dans l'exemple il y'a deux menus.

C'est un menu à 2 niveaux, cela ne correspond pas à ce que je souhaite.

Après moulte recherches , j'ai trouvé plusieurs menus rétractables à plusieurs niveaux qui se déploient verticalement.

Un de ceux là devraient faire l'affaire:
- http://www.filamentgroup.com/example...sHierarchical/
- http://jquery.bassistance.de/treeview/demo/
- http://blog.evaria.com/wp-content/th...ndex-multi.php