Maison > interface Web > js tutoriel > Quelques méthodes d'effets spéciaux courantes et exemples d'utilisation que jquery doit connaître (organisés)

Quelques méthodes d'effets spéciaux courantes et exemples d'utilisation que jquery doit connaître (organisés)

巴扎黑
Libérer: 2017-06-30 11:06:23
original
1125 Les gens l'ont consulté

Cet article a compilé quelques exemples d'effets spéciaux couramment utilisés, tels que : .jQuery fadeIn() est utilisé pour faire apparaître des éléments cachés. La méthode jQuery fadeToggle() peut être utilisée entre fadeIn(). et fadeOut(). Pour changer, etc., les amis intéressés peuvent se référer à ce qui suit

1.jQuery fadeIn() est utilisé pour faire apparaître les éléments cachés.
Syntaxe :
$(selector).fadeIn(speed,callback);
Exemple :

Copier le code Le code est le suivant :


$("bouton").click(function(){ $("#p1").fadeIn(); $("#p2").fadeIn("lent"); $(" #p3" ).fadeIn(3000);});


2. La méthode jQuery fadeOut() est utilisée pour faire disparaître les éléments visibles.
Syntaxe :
$(selector).fadeOut(speed,callback);

3. La méthode fadeToggle() de jQuery peut basculer entre les méthodes fadeIn() et fadeOut().
fadeToggle() ajoute un effet de fondu entrant à l'élément s'il est déjà fondu.
Si l'élément est déjà apparu en fondu, fadeToggle() ajoute un effet de fondu sortant à l'élément.
Syntaxe :
$(selector).fadeToggle(speed,callback);
Exemple :

Copier le code Le code est le suivant :


$("bouton").click(function(){ $("#p1").fadeToggle(); $("#p2").fadeToggle("lent"); $(" #p3" ).fadeToggle(3000);});


Ici, je tiens à dire que généralement jquery a une méthode de négation et réversible pour réaliser la synthèse d'une seule méthode. Il en va de même pour celui du dessous qui monte et descend.

4. Syntaxe :
$(selector).fadeTo(speed,opacity,callback);
Le paramètre de vitesse requis spécifie la durée de l'effet. Il peut prendre les valeurs suivantes : "lent", "rapide" ou millisecondes.
Le paramètre d'opacité requis dans la méthode fadeTo() définit l'effet de fondu sur l'opacité donnée (une valeur comprise entre 0 et 1). Exemple

Copier le code Le code est le suivant :


$("button").click(function(){
$ ("# p1").fadeTo("lent",0.15);
$("#p2").fadeTo("lent",0.4);
$("#p3").fadeTo(" slow", 0.7);
});


5. La méthode jQuery slideDown() est utilisée pour faire glisser des éléments vers le bas.
Syntaxe :
$(selector).slideDown(speed,callback);
$("#flip").click(function(){ $("#panel").slideDown();} );

6.La méthode jQuery slideUp() est utilisée pour faire glisser les éléments vers le haut.
Syntaxe :
$(selector).slideUp(speed,callback);
Le paramètre facultatif de vitesse spécifie la durée de l'effet. Il peut prendre les valeurs suivantes : "lent", "rapide" ou millisecondes.
Le paramètre de rappel facultatif est le nom de la fonction exécutée une fois la diapositive terminée.

7. La méthode jQuery slideToggle() peut basculer entre les méthodes slideDown() et slideUp().
Si des éléments glissent vers le bas, slideToggle() les fait glisser vers le haut.
Si des éléments glissent vers le haut, slideToggle() les fait glisser vers le bas.
$(selector).slideToggle(speed,callback);

8. La méthode jQuery animate() est utilisée pour créer une animation personnalisée.
Syntaxe :
$(selector).animate({params},speed,callback);
Le paramètre params requis définit la propriété CSS qui forme l'animation.
Le paramètre optionnel de vitesse précise la durée de l'effet. Il peut prendre les valeurs suivantes : "lent", "rapide" ou millisecondes.
Le paramètre de rappel facultatif est le nom de la fonction à exécuter une fois l'animation terminée.
Il est également possible de définir des valeurs relatives (la valeur est relative à la valeur actuelle de l'élément). Vous devez ajouter += ou -= devant la valeur :
Vous pouvez également définir un groupe d'animations pour implémenter la fonction queue.
L'exemple suivant montre une application simple de la méthode animate() ; elle déplace l'élément

vers la gauche jusqu'à ce que l'attribut left soit égal à 250 pixels :
Exemple

Copiez le code Le code est le suivant :


$("button").click(function(){ $("p").animate({left: '250px'});}) ;


9. La méthode jQuery stop() est utilisée pour arrêter les animations ou les effets avant qu'ils ne soient terminés

10. l'animation est terminée à 100%, la fonction Callback est appelée .
Syntaxe typique :
$(selector).hide(speed,callback)

Lien de la méthode 11.jQuery
Certains éléments ne doivent être obtenus qu'une seule fois, vous pouvez donc utiliser le lien pour ajouter la méthode .
C’est la méthode des points. Tels que
$("#p1").css("color","red").slideUp(2000).slideDown(2000);

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