[MooTools] module Fx.Slide

Bonsoir à tous, j'en viens à vous afin que vous puissiez m'aider dans un petit problème de javascript qui je pense et tout bête mais malheureusement je n'arrive pas à mettre le doit dessus. Alors le problème est le suivant, bon c'est pas très simple à expliquer donc je vais essayé d'être le plus clair possible ... ( c'est pas gagné)

J'utilise actuellement le script mootools, et plus particulièrement le module Fx.Slide : Afin de l'intégrer dans ma propre page je rentre ce code javascript :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 <script type="text/javascript" src="mootools.svn.js"></script> <script type="text/javascript"> window.addEvent('domready', function(){ var mySlide = new Fx.Slide('section'); mySlide.hide(); $('toggle').addEvent('click', function(e){ e = new Event(e); mySlide.toggle(); e.stop(); }); }); window.addEvent('domready', function(){ var mySlide = new Fx.Slide('section2'); mySlide.hide(); $('toggle2').addEvent('click', function(e){ e = new Event(e); mySlide.toggle(); e.stop(); }); });
suivit de ce code HTML :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 <h2><span><a href="#" id="toggle">Le Grand Bleu</a></span></h2> <div id="section"> <div> <strong>Simple section</strong><br /> This is a fluid section with four rounded borders. You can resize this section changing the width of the container DIV.<br /> <br /> Click on the section header to hide this section. </div> </div> <h2><span><a href="#" id="toggle2">Le Grand Bleu</a></span></h2> <div id="section2"> <div> <strong>Simple section</strong><br /> This is a fluid section with four rounded borders. You can resize this section changing the width of the container DIV.<br /> <br /> Click on the section header to hide this section. </div> </div>
Mon problème est assez simple j'aimerai pouvoir insérer une seule fois le code javascript :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 window.addEvent('domready', function(){ var mySlide = new Fx.Slide('section'); mySlide.hide(); $('toggle').addEvent('click', function(e){ e = new Event(e); mySlide.toggle(); e.stop(); }); });
est que cela fonctionne pour toutes les div auxquelles je l'attribuai, le problème est que lorsque j'essaye de le faire en mettant qu'une seule fois le code JS et en l'appelant sur chacune de met div ça marche pour la première mais pas pour la suivante ...

J'espère avoir été clair ... :?
voila si vous voulez plus de précision sur mon problème je joint un fichier avec les fichiers dont je me sert Ici

Merci d'avance à tous ceux qui voudront bien m'aider :D