Maison  >  Article  >  interface Web  >  Comment obtenir un effet de fondu entrant et sortant dans jquery

Comment obtenir un effet de fondu entrant et sortant dans jquery

coldplay.xixi
coldplay.xixioriginal
2020-11-27 10:55:124315parcourir

Comment implémenter l'effet de fondu d'entrée et de sortie avec jquery : créez d'abord un nouveau document texte et introduisez jquery ; puis utilisez la méthode [fadeIn()] pour faire apparaître les éléments cachés ; méthode [fadeOut()] pour faire disparaître les éléments visibles.

Comment obtenir un effet de fondu entrant et sortant dans jquery

L'environnement d'exploitation de ce tutoriel : système Windows 7, jquery version 3.2.1, ordinateur Dell G3.

Comment obtenir des effets de fondu d'entrée et de sortie avec jquery :

1 Créez un nouveau document texte pour l'affichage et l'écriture de code, comme indiqué dans la figure. ;

Comment obtenir un effet de fondu entrant et sortant dans jquery

2. Créez deux divs avec les ID div1 et div2, comme indiqué dans la figure

Comment obtenir un effet de fondu entrant et sortant dans jquery

3. Introduisez jquery.js, puis il sera utilisé comme indiqué dans l'image

Comment obtenir un effet de fondu entrant et sortant dans jquery

4 La méthode fadeIn() peut faire apparaître les éléments cachés, comme indiqué dans l'image ; ;

Comment obtenir un effet de fondu entrant et sortant dans jquery

5. fadeOut(), vous pouvez faire disparaître les éléments visibles, comme indiqué sur la figure

Comment obtenir un effet de fondu entrant et sortant dans jquery

6.

méthode, si si caché, fondu entrant, si visible, fondu sortant fadeToggle()

Comment obtenir un effet de fondu entrant et sortant dans jquery

, comme indiqué sur la figure, peut disparaître ; à une opacité donnée

fadeTo("slow",0.4)

Comment obtenir un effet de fondu entrant et sortant dans jquery

Recommandations d'apprentissage associées :
tutoriel vidéo javascript

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!

Déclaration:
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