DezinerFolio Simple Accordians déveloper menu
stephane_br
Messages postés
27
Statut
Membre
-
stephane_br Messages postés 27 Statut Membre -
stephane_br Messages postés 27 Statut Membre -
Bonjour,
j'ai trouvé sur le net ce fabuleux code afin de développer un menu en accordéon.
Voici de quoi je parle : http://www.dezinerfolio.com/2007/07/19/simple-javascript-accordions/
Voilà, donc j'ai testé ce code dans une de mes pages dont le code source est en ASP :
Dans la partie <head></head>, j'ai inclus :
<script type="text/javascript" src="_PackAccordeonMenu/accordian-src.js"></script>
Dans la partie <body>, j'ai mis :
<body onload="new Accordian('BLOCINTLEFT',2,'header_highlight');">
Dans ma page, voici la structure des Divs :
<div id="BLOCINTLEFT">
<div class="BlocLienLeft header_highlight" id="test1-header"><a href="#" class="LiensBlancs">Titre principal 01</a></div>
<div id="test1-content" class="BlocSousMenus" style="display:none;">
<div class="BlocLienLeftSousMenu2">
<a href="#" class="LienLeftSousMenu">sous-titre 01</a>
</div>
<div class="BlocLienLeftSousMenu">
<a href="#" class="LienLeftSousMenu">sous-titre 02</a>
</div>
</div>
<div class="BlocLienLeft" id="test2-header"><a href="#" class="LiensBlancs">Titre principal 01</a></div>
<div id="test2-content" class="BlocSousMenus" style="display:none;">
<div class="BlocLienLeftSousMenu2">
<a href="#" class="LienLeftSousMenu">sous-titre 01</a>
</div>
<div class="BlocLienLeftSousMenu">
<a href="#" class="LienLeftSousMenu">sous-titre 02</a>
</div>
</div>
.... etc ...
</div>
Donc, tout fonctionne, pas de problème. Lorsque mon site s'ouvre, tous les sous-menus du menu se ferment.
Il faut cliquer dessus pour développer un menu.
Mon soucis est que, une fois cliqué sur un sous-menu, ça m'ouvre une page et à l'ouverture de cette page, tous les sous-menus se réinitialisent et se referment donc. j'aimerais que le sous-menu sur lequel on a cliqué reste ouvert après le clic et l'ouverture de la nouvelle page associée au lien de ce sous-menu. Je ne sais pas si je suis clair dans mes explciations.
Bref, dans mon code ASP, je peux identifier le sous-menu qui doit être activé dans la page et j'aimerais trouver la commande javascript qui me permettrais d'ouvrir à la main, depuis mon code source, le sous-menu de la page active.
De même, comment fermer un sous-menu ouvert en cliquant sur le nom du menu ?
Merci par avance pour toute votre aide car je ne trouve pas ces infos sur le site de l'auteur et sur les différents forums. j'ai regardé le code source du javascript, mais je ne comprend pas comment il fait ça. J'ai vu qu'il associe un évènement onclick apparement, mais je ne vois pas comment le provoquer manuellement cet évènement.
Cordialement.
j'ai trouvé sur le net ce fabuleux code afin de développer un menu en accordéon.
Voici de quoi je parle : http://www.dezinerfolio.com/2007/07/19/simple-javascript-accordions/
Voilà, donc j'ai testé ce code dans une de mes pages dont le code source est en ASP :
Dans la partie <head></head>, j'ai inclus :
<script type="text/javascript" src="_PackAccordeonMenu/accordian-src.js"></script>
Dans la partie <body>, j'ai mis :
<body onload="new Accordian('BLOCINTLEFT',2,'header_highlight');">
Dans ma page, voici la structure des Divs :
<div id="BLOCINTLEFT">
<div class="BlocLienLeft header_highlight" id="test1-header"><a href="#" class="LiensBlancs">Titre principal 01</a></div>
<div id="test1-content" class="BlocSousMenus" style="display:none;">
<div class="BlocLienLeftSousMenu2">
<a href="#" class="LienLeftSousMenu">sous-titre 01</a>
</div>
<div class="BlocLienLeftSousMenu">
<a href="#" class="LienLeftSousMenu">sous-titre 02</a>
</div>
</div>
<div class="BlocLienLeft" id="test2-header"><a href="#" class="LiensBlancs">Titre principal 01</a></div>
<div id="test2-content" class="BlocSousMenus" style="display:none;">
<div class="BlocLienLeftSousMenu2">
<a href="#" class="LienLeftSousMenu">sous-titre 01</a>
</div>
<div class="BlocLienLeftSousMenu">
<a href="#" class="LienLeftSousMenu">sous-titre 02</a>
</div>
</div>
.... etc ...
</div>
Donc, tout fonctionne, pas de problème. Lorsque mon site s'ouvre, tous les sous-menus du menu se ferment.
Il faut cliquer dessus pour développer un menu.
Mon soucis est que, une fois cliqué sur un sous-menu, ça m'ouvre une page et à l'ouverture de cette page, tous les sous-menus se réinitialisent et se referment donc. j'aimerais que le sous-menu sur lequel on a cliqué reste ouvert après le clic et l'ouverture de la nouvelle page associée au lien de ce sous-menu. Je ne sais pas si je suis clair dans mes explciations.
Bref, dans mon code ASP, je peux identifier le sous-menu qui doit être activé dans la page et j'aimerais trouver la commande javascript qui me permettrais d'ouvrir à la main, depuis mon code source, le sous-menu de la page active.
De même, comment fermer un sous-menu ouvert en cliquant sur le nom du menu ?
Merci par avance pour toute votre aide car je ne trouve pas ces infos sur le site de l'auteur et sur les différents forums. j'ai regardé le code source du javascript, mais je ne comprend pas comment il fait ça. J'ai vu qu'il associe un évènement onclick apparement, mais je ne vois pas comment le provoquer manuellement cet évènement.
Cordialement.
A voir également:
- DezinerFolio Simple Accordians déveloper menu
- Menu déroulant excel - Guide
- Iphone 14 simple - Guide
- Simple pdf - Télécharger - PDF
- Simple ocr - Télécharger - Bureautique
- Simple file locker - Télécharger - Sécurité
3 réponses
Merci pour ta réponse. Mais ce n'est pas vraiment ce que je veux faire. Si je met ça sur mon lien, la page voulue ne va pas s'ouvrir et rien ne va se passer ?! Or JE VEUX que ça m'ouvre la page du lien de mon sous-menu, mais je veux qu'après que cette page soit chargée, je veux ouvrir manuellement le sous-menu de la page.
Par exemple, au chargement on a :
RUBRIQUE 01
RUBRIQUE 02
RUBRIQUE 03
Si on clique sur "RUBRIQUE 01", ça ouvre le sous-menu associé et on a donc l'affichage suivant :
RUBRIQUE 01
sous-menu-item-01
sous-menu-item-02
sous-menu-item-03
sous-menu-item-04
RUBRIQUE 02
RUBRIQUE 03
Maintenant, si je clique sur "sous-menu-item-03", ça m'ouvre une nouvelle page et ça rénitialise donc à son chargement, mon menu qui s'affiche maintenant comme ceci :
RUBRIQUE 01
RUBRIQUE 02
RUBRIQUE 03
Hors, j'aimerais que, ça s'affiche comme ça (que le sous-menu de la rubrique en cours reste développé) :
RUBRIQUE 01
sous-menu-item-01
sous-menu-item-02
sous-menu-item-03
sous-menu-item-04
RUBRIQUE 02
RUBRIQUE 03
Par exemple, au chargement on a :
RUBRIQUE 01
RUBRIQUE 02
RUBRIQUE 03
Si on clique sur "RUBRIQUE 01", ça ouvre le sous-menu associé et on a donc l'affichage suivant :
RUBRIQUE 01
sous-menu-item-01
sous-menu-item-02
sous-menu-item-03
sous-menu-item-04
RUBRIQUE 02
RUBRIQUE 03
Maintenant, si je clique sur "sous-menu-item-03", ça m'ouvre une nouvelle page et ça rénitialise donc à son chargement, mon menu qui s'affiche maintenant comme ceci :
RUBRIQUE 01
RUBRIQUE 02
RUBRIQUE 03
Hors, j'aimerais que, ça s'affiche comme ça (que le sous-menu de la rubrique en cours reste développé) :
RUBRIQUE 01
sous-menu-item-01
sous-menu-item-02
sous-menu-item-03
sous-menu-item-04
RUBRIQUE 02
RUBRIQUE 03
Dans le code démo, je vois que le fait d'ajouter 'header_highlight' dans le premier sous-menu, et en l'incluant dans l'appel de la fonction dans le <head>, ça ouvre le menu indiqué. Mais je l'ai mis dans mon code et ça ne fait rien alors que dans la démo ça marche. Je ne comprend pas pourquoi !!!
Exemple ici, au chargement de la page, le premier menu s'ouvre tout seul : http://www.dezinerfolio.com/wp-content/uploads/accordemo/01.html
Exemple ici, au chargement de la page, le premier menu s'ouvre tout seul : http://www.dezinerfolio.com/wp-content/uploads/accordemo/01.html
