JQUERY – Les effets

I► Dans cet article, nous allons voir les effets d’animation que propose la bibliothèque JQuery par défaut :

  1. animate (css, callBack, vitesse)

    Cette méthode permet de créer ses propres animations en utilisant les propriétés CSS
    Exemple :
    $(‘#boite’).animate({ backgroundColor: ‘#aa0000’, color: ‘#fff’, width: 500,  height:150}, 1000 );
    L’option vitesse est évaluée en ms ou avec les attributs : ‘slow’ ‘normal’ ‘fast’
    Le callBack permet d’appeler une fonction en fin d’animation
    CaptureCe qui donne :Capture2
  2. fadeIn (vitesse, callBack) | fadeOut (vitesse, callBack)

    Cette méthode permet de faire apparaître ou disparaître progressivement l’élément
    CallBack permet d’exécuter une fonction en fin d’animation
  3. fadeTo (vitesse, opacité, callBack)

    Comme fadeIn et fadeOut mais on peut régler le degré d’opacité entre 0 et 1
  4. hide (vitesse, callBack) |  hide (vitesse, callBack)

    Rejoint quelque part fadeIn et fadeOut mais à la différence que la hauteur et la largeur de l’élément sont progressivement diminués jusqu’à disparaître
    Le résultat est comme pour les fadexxx, on obtient un display:none
  5. slideUp (vitesse, callback) | slideDown(vitesse, callBack) | slideToggle(vitesse, callBack)

    SlideUp cache l’élément selon un axe vertical
    SlideDown affiche l’élément masqué selon un axe vertical
    SlideToggle est une version alternée de slideDown et slideUp

Vous pourrez voir et tester les effets ici : http://www.bocciolesi.fr/tutoriel-jquery/les-effets-jquery.html

Michel BOCCIOLESI