Wyjaśniono metody zanikania jQuery

Blakowanie jest właściwością, która umożliwia manipulowanie krycie (przezroczystość) elementów HTML. JQuery oferuje cztery metody zanikania, które pozwalają zmienić przejrzystość elementów. Metody te obejmują, fadein (), fadeout (), fadetoggle () i fadeto ().

W tym artykule bada metody zanikania w jQuery i służy następującym wynikach uczenia się.

• Praca metod zanikania jQuery
• Korzystanie z metod zanikania jQuery

Jak używać metod zanikania jQuery

Jak omówiono wcześniej, JQuery ma cztery metody zanikające i podano głęboki wgląd w wszystkie te metody.

Jak użyć metody Fadein ()

Metoda fadein () wyświetla element poprzez zwiększenie krycia. Składnia tej metody podano poniżej:

$ (selektor).fadein (prędkość, wywołanie zwrotne);

Składnia ma następujące przypadki

• selektor może być dowolnym elementem lub może odnosić się do klasy lub identyfikatora dowolnego elementu.
• prędkość można określić w jednej z czterech wartości: powolne, średnie, szybkie i milisekund.
• oddzwonić jest opcjonalnym parametrem i jest wykonywany po pomyślnym wykonywaniu funkcji.

Przykład

Kod podany poniżej pokazuje wykorzystanie metody jQuery Fadeout ().

JQuery

$ (dokument).gotowy (funkcja ()
$ (".Fadein ”).kliknij (funkcja ()
$ (".powolny").Fadein („powolny”);
$ (".szybko").Fadein („FAST”);
$ (".Mili ").Fadein (2000);
);
);

Kod jest opisany jako,

• .Fadein odnosi się do klasy przycisku i po kliknięciu przycisku, zniknie w akapitach
• .powolny, .szybki i .Mili Zajęcia odnoszą się do trzech akapitów, które będą wyblakłe przy różnych prędkościach

Notatka: Właściwość wyświetlania elementu (którą zamierzasz zniknąć) musi być ustawiona na brak.

Wyjście

Jak blakamy, a właściwość wyświetlania akapitów jest ustawiona nic. Zatem akapity będą ukryte w uruchomieniu strony.

Po kliknięciu przycisku zauważysz, że akapity pojawią się w zależności od prędkości, jak pokazano na poniższym obrazku.

Jak używać metody Fadeout ()

Metoda Fadeout () zanika wyświetlany element poprzez zmniejszenie krycia elementu. Składnia tej metody podano poniżej:

$ (selektor).Fadeout (prędkość, wywołanie zwrotne);

Przykład

Kod napisany poniżej pokazuje wykorzystanie metody jQuery Fadeout ().

Powyższy kod jest opisany jako,

• .Fadeout Klasa przycisku jest używana, która zniknie akapitów
• .powolny, .szybki i .Mili to nazwy klas ustawione dla akapitów i będą używane do zniknięcia, a także do stylizacji

Wyjście

W metodzie Fadeout () akapity zostaną wyświetlone, jak pokazano poniżej.

Po kliknięciu przycisku akapity znikną.

Jak używać metody Fadeto ()

Metoda Fadeto () działa na zasadzie metody Fadeout (). Jednak Fadeto () zanika element za pomocą zakresu liczbowego (0-1). Ten zakres krycia określa poziom krycia elementu, im wyższa liczba będzie krycia i odwrotnie. Składnia jest podana poniżej:

$ (selektor).fadeto (prędkość, krycie, wywołanie zwrotne);

Parametr krycia akceptuje wartość 0 do 1.

Przykład

Kod podany poniżej praktykuje metodę Fadeto ().

Kod jest opisany jako,

• .zniknąć do odnosi się do klasy przycisku
• #min, #avg i #max reprezentuje identyfikatory trzech tagów div, a te identyfikatory odnoszą się do wartości, które zostaną użyte dla metody Fadeto ()
• Wartość zanikająca waha się od 0 do 1 w metodach Fadeto ()

Wyjście

Przed zastosowaniem metody Fadeto ()

Po zastosowaniu metody Fadeto ()

Z powyższego wyjścia obserwuje się, że akapit o wartości 0 został wyprany.

Jak używać metody Fadetoggle ()

Metoda Fadetoggle () leży między metodami Fadein () i Fadeout (). Za pomocą fadetoggle () możesz wyświetlić ukryty element i ukryć wyświetlany element. Składnia tej metody to:

$ (selektor).fadeto (prędkość, wywołanie zwrotne);

Przykład

Kod podany poniżej funkcji do użycia metody Fadetoggle ().

• .Fadetoggle klasa odnosi się do przycisku
• #powolny, #fast i #mili reprezentuje różne identyfikatory div

Wyjście

Przed kliknięciem przycisku

Po kliknięciu przycisku,

Stwierdzono, że jeśli element jest wyświetlany, zostanie ukryty po metodzie Fadetoggle () (jak to robi metoda fadeout ()). Podobnie, jeśli element jest w stanie Fadeout (), wówczas fadetoggle () będzie działać jako metoda fadein ().

Wniosek

JQuery zapewnia różne metody zanikania, które obejmują fadein (), fadeout (), fadetoggle () i fadeto (), które pomagają w zanikaniu elementów HTML. Ten przewodnik zapewnia działanie i wykorzystanie każdej metody zanikania jQuery. Metoda fadein () wyświetla element, jeśli jest ukryty, podczas gdy fadeout () ukrywa element. Metoda Fadeto () zanika w zależności od numeru krycia. Wreszcie funkcje metody Fadetoggle () między metodami fadein () i fadeout ().