13
Indiquez l’intérêt que vous portez à cette question
0

Un joli menu déroulant avec jquery.

Pierre

Bonjour

Je viens de créer un menu avec jquery et le plugin animatedcollapse. que voici

<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('#TITRE', 'fade=1,height=auto')
<BOUCLE_ssRub(RUBRIQUES){id_parent}{par num titre}>
animatedcollapse.addDiv('#TITRE', 'fade=1,height=auto')
</BOUCLE_ssRub> 
</BOUCLE_Rubriques>


animatedcollapse.init()
</script>

 

<BOUCLE2(RUBRIQUES){racine}{par num titre}>
<a href="javascript:animatedcollapse.toggle('#TITRE')"><p><b>#TITRE</b></p></a>
<div id="#TITRE"  "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('#TITRE')"><p><b>#TITRE</b></p></a>
			<div id="#TITRE" "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>

Ca marche bien, Je défini les variables javascript grace aux #TITRE. mais je reste bloqué pour définir une variable sans espace nottament pour nommé la/les div animée(s) :).

Si mon titre de rubrique contient un espace c’est mort :/ l’animation ne fonctionnera pas sur celui-ci.

Pour voir la démo du menu c’est ici, il faut que je l’habille correctement mais ca fonctionne plutot bien sur IE7, Firefox3.

http://pierrox.homelinux.com/spip/spip1.9.2d

Si vous avez une idée pour récuperer un identifiant unique de rubrique sans espace je suis preneur.

Boucles CSS JQuery SPIP