Le blog de nodeo

Aller au contenu | Aller au menu | Aller à la recherche

lundi, mai 7 2007

Initialiser un effet au chargement de la page avec jQuery

Pour faire suite au billet "Initialiser un effet au chargement de la page avec mootools",

Pour créer un effet d'apparition de l'élement "submenu" j'avais écrit avec mootools :

<script type="text/javascript">

window.addEvent('load', function() {
var myFx = new Fx.Style('submenu', 'opacity', {duration: 500}).start(0,1);
});

</script>

voici la version écrite avec jQuery :

<script type="text/javascript">

    $(document).ready(function(){
            $("#submenu").fadeIn(500);
    });

</script>

ou, si on utilise une autre libraierie javascript, pour éviter les conflits on peut utiliser la fonction noConflict :

<script type="text/javascript">
     var $j = jQuery.noConflict();

    $j(document).ready(function(){
            $j("#submenu").fadeIn(500);
    });

</script>

De mootools à jQuery

Après quelques expérimentations avec mootools, et une discussion passionnante sur les forums de MODx sur la comparaison entre mootools et jQuery, j'ai décidé de tester un peu jQuery.

Je reprendrai les deux exemples de mise en oeuvre avec mootools, ré-écrit avec jQuery cette fois, dans de futurs billets. En attendant, après plusieurs heures sur la doc, je vais finalement opter pour jQuery comme libraierie javascript pour mes développements. Les raisons ?

  1. la possibilité d'utiliser facilement jQuery avec d'autres libraieries (via namespace)
  2. la clarté et la progressivité de la documentation (mootools est beaucoup plus difficile d'accès)
  3. le support autour de jQuery, qui à mon sens est bien meilleur en tout cas lorsque l'on souhaite se former