[SPIP Forums] - Un joli menu déroulant avec jquery.

Chourak 2 août 2008 10:29	Un joli menu déroulant avec jquery. Bonjour, Pour avoir un id unique et sans espace pourquoi n’essaies tu pas d’utiliser quelque chose à base de #ID_RUBRIQUE : `<div id="rub#ID_RUBRIQUE">` Tu aurais chaque id de div dans le format rub1, rub2 etc... Bien sur tu dois aussi changer ton js : `animatedcollapse.addDiv('rub#ID_RUBRIQUE', 'fade=1,height=auto')` Sinon tu peux aussi faire le même genre de chose avec #COMPTEUR_BOUCLE à la place de #ID_RUBRIQUE mais dans ce cas c’est plus intéressant quand tu dois exploiter un système d’incrémentation.
Pierre 2 août 2008 16:05	Un joli menu déroulant avec jquery. Merci je test ça dessuite :)
Pierre 2 août 2008 16:25	Un joli menu déroulant avec jquery. C’est OK. Grand Merci à toi Chourak.
Pierre 2 août 2008 16:35	Un joli menu déroulant avec jquery. Pour ceux que ça interesse je laisse le code ici : <script type="text/javascript" src="jquery-1.2.2.pack.js"></script> <script type="text/javascript" src="animatedcollapse.js"></script> <script type="text/javascript"> <BOUCLE_Rubriques(RUBRIQUES){racine}{par num titre}> animatedcollapse.addDiv('rub#ID_RUBRIQUE', 'fade=1,height=auto') <BOUCLE_ssRub(RUBRIQUES){id_parent}{par num titre}> animatedcollapse.addDiv('ssrub#ID_RUBRIQUE', 'fade=1,height=auto') </BOUCLE_ssRub> </BOUCLE_Rubriques> animatedcollapse.init() </script> <BOUCLE2(RUBRIQUES){racine}{par num titre}> <a href="javascript:animatedcollapse.toggle('rub#ID_RUBRIQUE')"><p><b>#TITRE</b></p></a> <div id="rub#ID_RUBRIQUE" "style="display:none"> <BOUCLE_ArtRub(ARTICLES){id_rubrique}{par num titre}><li class="plan-article"> <a href="[(#URL_ARTICLE)]" class="[(#EXPOSE{current,off_current})]">[(#TITRE\|supprimer_numero)]</a> </li> </BOUCLE_ArtRub> <BOUCLE_ssRub2(RUBRIQUES){id_parent}{par num titre}> <a href="javascript:animatedcollapse.toggle('ssrub#ID_RUBRIQUE')"><p><b>#TITRE</b></p></a> <div id="ssrub#ID_RUBRIQUE" "style="display:none"> <BOUCLE_ArtssRub(ARTICLES){id_rubrique}{par num titre}> <li class="plan-article"> <a href="[(#URL_ARTICLE)]" class="[(#EXPOSE{current,off_current})]">[(#TITRE\|supprimer_numero)]</a> </li> </BOUCLE_ArtssRub> </div> </BOUCLE_ssRub2> </div> </BOUCLE2>
Chourak 2 août 2008 21:25	Un joli menu déroulant avec jquery. De rien :) Merci pour le code, je vais me le mettre de coté, il pourrait me servir ;)
Pierre 21 août 2008 03:13	Un joli menu déroulant avec jquery. J’ai changé l’adresse de mon site pour info En terme de contenu rien de bien interessant mais vous pouvez toujours me laissé un petit message sur le forum en test^ Viendez tout plein http://spirale.homelinux.org
Pierre 21 août 2008 03:28	Un joli menu déroulant avec jquery. J’ai changé l’adresse de mon site pour la rendre un peu plus conventionnelle. Pour ceux que ca interessent http://spirale.homelinux.com le contenu n’est pas encore tres interessant mais Le menu est parfaitement opérationnel sous firefox 2.0 3.0 Opera 9.5 et safari. Il faut que je me penche sur un CSS nickel pour IE7. mais ca fonctionne. c’est juste le CSS qui deconne^ Pas eu le temps de tester IE6. N’hesitez pas à laisser vos commentaires et éventuellement me poser des questions sur le forum prévu a cette effet. je vous repondrai avec grand plaisir. Viendez tout plein :)
Pierre 21 août 2008 03:30	Un joli menu déroulant avec jquery. http://spirale.homelinux.org p$ù%*## !!
Hugh 23 août 2008 15:36	Un joli menu déroulant avec jquery. Merci pour ce bout de code, je viens d’intégrer ça à mon site en cours. Par contre j’aimerais si possible que la rubrique dans laquelle on se trouve soit déroulée par défaut. Je ne vois pas comment faire en utilisant les filtres SPIP... Est-ce que quelqu’un aurait une idée ?
Pierre 23 août 2008 18:21	Un joli menu déroulant avec jquery. <script type="text/javascript"> <BOUCLE_Rubriques(RUBRIQUES){racine}{par num titre}> animatedcollapse.addDiv('rub#ID_RUBRIQUE', 'fade=1,height=auto,hide=1') <BOUCLE_ssRub(RUBRIQUES){id_parent}{par num titre}> animatedcollapse.addDiv('ssrub#ID_RUBRIQUE', 'fade=1,height=auto,hide=1') </BOUCLE_ssRub> </BOUCLE_Rubriques> animatedcollapse.init() </script> <script type="text/javascript" src="jquery-1.2.2.pack.js"></script> <script type="text/javascript" src="animatedcollapse.js"></script> <div id="menuderoulantrubrique"> <ul> <B_articles> <BOUCLE_articles(ARTICLES){id_rubrique}{par date}{inverse}{pagination}> <li> <a href="#URL_ARTICLE" title="#SOUSTITRE">#TITRE</a></li> </BOUCLE_articles> </B_articles> <BOUCLE2(RUBRIQUES){id_rubrique}{par num titre}> <BOUCLE_ssRub2(RUBRIQUES){id_parent}{par num titre}> <li><a href="javascript:animatedcollapse.toggle('ssrub#ID_RUBRIQUE')">[(#TITRE\|supprimer_numero)]</a></li> <div id="ssrub#ID_RUBRIQUE" style="margin-left: 6px"> <BOUCLE_ArtssRub(ARTICLES){id_rubrique}{par num titre}> <li><a href="[(#URL_ARTICLE)]" class="[(#EXPOSE{current,off_current})]">[(#TITRE\|supprimer_numero)]</a></li> </BOUCLE_ArtssRub> </div> </BOUCLE_ssRub2> </BOUCLE2> </ul> </div> Pour lister les articles et afficher les sous rubriques de la rubrique courante.