Mémento jQuery

Effets visuels standards

fadeIn (duration)

Fait apparaître les éléments de la liste en amenant progressivement leur opacité à 1, pendant la durée duration (en millisecondes). Par défaut 400 ms.

fadeOut (duration)

Fait disparaître les éléments de la liste en amenant progressivement leur opacité à 0, pendant la durée duration (en millisecondes). Par défaut 400 ms.

fadeToggle (duration)

Alterne fadeOut () ou fadeIn () sur chaque élément de la liste selon que l'élément est visible ou caché.

show (duration)

Fait apparaître les éléments de la liste progressivement, pendant la durée duration (en millisecondes). Par défaut 0 ms, provoquant un affichage instantané.

hide (duration)

Fait disparaître les éléments de la liste progressivement, pendant la durée duration (en millisecondes). Par défaut 0 ms, les cachant instantanément.

toggle (duration)

Alterne hide () ou show () sur chaque élément de la liste selon que l'élément est visible ou caché.

Effets visuels personnalisés

On peut créer ses propres effets en utilisant la méthode animate (objStyle, options) qui produit un effet sur les éléments de la liste.

animate (objStyle, options)

Produit un effet visuel personnalisé sur les éléments de la liste.

Le paramètre objStyle représente un objet contenant le nouveau style des éléments à la fin de l'effet. Cet objet est de la forme (prop1 : value1, prop2: value2, ...), chaque prop étant une propriété CSS que l'on désire voir évoluer jusqu'à la valeur indiquée par value.

Le paramètre options représente un objet contenant les options de l'effet, décrites ci-après.

Options de la méthode animate (objStyle, options)

duration

Indique le nombre de millisecondes de l'effet. Une valeur de 0 amène l'élément directement dans le nouveau style, sans progressivité.

complete

Méthode complete () appelée pour chacun des éléments de la liste lorsque l'effet est terminé sur celui-ci. La valeur this dans la fonction représente l'élément DOM pour lequel l'effet est terminé.

step

Méthode step () appelée pour chacun des éléments de la liste, après chaque mise à jour des propriétés CSS du style de l'élément. Elle peut donc être appelée plusieurs centaines de fois pour une même animation, à la différence de options.complete appelée une seule fois (pour chaque élément de la liste) à la fin de l'animation.

queue

Par défaut, deux effets ne peuvent pas s'exécuter simultanément sur le même élément, car le second effet est mis dans une file d'attente (il sera exécuté lorsque l'effet précédent sur cet élément sera terminé). Si options . queue est positionnée à false, l'effet n'est pas mis dans la file d'attente et peut donc s'exécuter immédiatement.