Maison > interface Web > js tutoriel > le corps du texte

Animations dans jQuery

炎欲天舞
Libérer: 2017-08-04 15:26:28
original
1101 Les gens l'ont consulté

Méthode 1.show() et méthode hide()

Contrôlez l'état d'affichage de l'élément - apparaissant et masquant, tout en modifiant la hauteur, la largeur et l'opacité du contenu, jusqu'à ce point, trois valeurs d'attribut sont 100 % ou 0 (affichage : aucun). Équivalent à display en css : block/inline/none;

Remarque : L'utilisation de jQuery pour les effets d'animation nécessite le mode standard, sinon cela peut provoquer une gigue d'animation. Le mode standard nécessite que l'en-tête du fichier contienne la définition DTD suivante :

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://wslideww.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
Copier après la connexion

Paramètres : rapide - 200 ms, normal - 400 ms, lent - 600 ms, nombre spécifié (les paramètres ms ne sont pas des nombres) ; plus des guillemets , le paramètre est numérique et n'a pas besoin d'être ajouté.

(1) Méthode fadeIn() et méthode fadeOut()

Changez uniquement l'opacité de l'élément - augmentez et diminuez la transparence jusqu'à ce que l'élément disparaisse complètement (affichage : aucun)

(2) méthode slideUp() et méthode slideDown()

Modifiez uniquement la hauteur de l'élément - réduire et développer

Méthode 2.animate() — Animation personnalisée

attribut gauche : Cet attribut définit la limite de marge positionnée gauche et son bloc contenant Décalage entre frontières gauches.

Remarque : Si la valeur de l'attribut "position" est "statique", alors la définition de l'attribut "gauche" n'aura aucun effet.

Format : animate(params,speed,callback)

(1) Le premier paramètre params : un mappage contenant des attributs de style et des valeurs, exemple : {property : "value1", property : " valeur1". . . . >

(2) Le deuxième paramètre speed : paramètre speed

(3) Le troisième paramètre callback : fonction de rappel, l'action effectuée lorsque l'animation est terminée

Supplémentaire : ①La valeur de l'attribut peut être accumulée ou décrémentée, animer({left:"+=500px"})

②Définissez différents attributs pour exécuter plusieurs animations en même temps, ou séparez les codes et exécutez-les en séquence

        ③animate() fonctionne toutes sur le même objet jQuery et peut utiliser l'écriture en chaîne pour réaliser plusieurs opérations

Fonction de rappel d'animation

File d'attente d'animation : les effets d'animation sont exécutés en séquence

Remarque : Seules les méthodes d'animation peuvent être ajoutées à la file d'attente d'animation. Les méthodes non animées ne seront pas ajoutées à la file d'attente d'animation, mais seront exécutées immédiatement. méthodes non animées en écrivant Implémentez la mise en file d'attente des méthodes non animées dans la fonction de rappel.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal