Uvod v učinke jQuery

jQuery je ena izmed najbolj priljubljenih knjižnic javascripta, ki je zasnovana tako, da poenostavi HTML DOM, tj. lastnosti modela predmeta dokumenta, kot so manipulacija in drevored. Poenostavljene so tudi druge lastnosti, kot so upravljanje dogodkov, animacija Ajax in CSS. Gre za odprtokodno in brezplačno knjižnico, ki se običajno uporablja v 73% od 10 milijonov spletnih strani, ki se danes uporabljajo. Glavne značilnosti jQuery vključujejo izbirnike DOM, manipulacijo in prehajanje, zaradi česar je delo na jQuery veliko lažje in bolj priročno. V tej temi bomo spoznali učinke jQuery.

Uporablja se za zagotavljanje zelo preprostega vmesnika za izvajanje različnih vrst neverjetnih učinkov. Te metode omogočajo hitro uporabo in uporabo najpogosteje uporabljenih funkcij-učinkov, skupaj z golimi do minimalnimi konfiguracijami. Ukaz za prikazovanje in skrivanje elementov je skoraj enak tistemu, ki bi ga vsi pričakovali. Ukaz Show () se uporablja za prikazovanje elementov v popolnoma zavitem nizu in ukaz skrivanja () se uporablja za njihovo skrivanje.

Različne metode jQuery efekta:

Tukaj razpravljamo o nekaterih različnih vrstah učinkov jQuery Effect

1) Animate ()

Animirana metoda se uporablja za izvajanje animacije po meri za nabor lastnosti CSS. Ta metoda se uporablja za spreminjanje stanja elementa iz enega stanja v drugega skupaj s slogi CSS. Vrednost lastnosti se spreminja postopoma, tako da je mogoče doseči animirani učinek. Treba je opozoriti, da je mogoče animirati samo številčne vrednosti, na primer marža: 40px. Po drugi strani vrednosti nizov ni mogoče animirati, kot je barva ozadja: zelena. To je spet izjema za strune, kot so prikaži, skrivaj in preklopi.

Sintaksa

(selector).animate((styles), duration, easing, callback)

Primer

$("label").click(func()(
$("#box").animate((height: "100px"));
));

2) Zamuda ()

Kot že ime pove, se ta uporablja za nastavitev zamude za vse funkcije, ki so na vrsti izbranih elementov.

Sintaksa

$(selector).delay(duration, NameOfQueue)

Primer

$("label").click(func()(
$("#div1").delay("fast").fadeOut();
$("#div2").delay("slow").fadeIn();
));

3) fadeToggle ()

Ta funkcija se uporablja za preklapljanje med funkcijami za zmanjševanje in zmanjševanje stanja na različnih poljih. Če kateri koli element zbledi, potem lahko to funkcijo fadeToggle () uporabimo za njihovo izbledevanje. Elementi, ki so v skriti obliki, ne bodo prikazani kot del te metode.

Sintaksa

$(selector).fadeToggle(duration, easing, callback)

Primer

$("label").click(func()(
$("#box").fadeToggle();
));

4) fadeTo ()

Ta metoda se uporablja za spreminjanje motnosti vseh

tj. postopki povezani z odstavkom. Navedena motnost v tem kontekstu se nanaša na spremenljiv učinek motnosti.

Sintaksa

$(selector).fadeTo(duration, opacity, easing, callback)

Primer

$("label").click(func()(
$("p").fadeTo(100, 0.9);
));

5) clearQueue ()

Ta metoda je enaka, kot jo predlaga ime. To se uporablja za čiščenje čakalne vrste in odstranjevanje vseh elementov iz čakalne vrste, ki niso bili zagnani. Funkcija bo dokončala po zagonu. To je povezano z dvema metodama. čakalna vrsta () in dequeue ().

Sintaksa

$(selector).clearQueue(NameOfQueue)

Primer

$("label").click(func()(
$("box").clearQueue();
));

6) zaključek ()

Ta metoda v jQuery se uporablja za zaključek ali zaključek trenutno delujočega animatorja, saj se uporablja za zaustavitev vseh trenutno izvedenih animacij in se uporablja za odstranitev vseh animacij iz čakalne vrste. Uporablja se tudi za dokončanje vseh animacij za raznoliko paleto izbranih elementov. Ta metoda je podobna metodam, kot je .stop, ki ima oba resnična parametra. Glavna razlika med to metodo in ciljem je, da se metoda zaključka uporablja za zaustavitev in zaustavitev vrst lastnosti lastnosti elementov CSS vseh čakalnih animacij.

Sintaksa

$(selector).finish(NameOfQueue)

Primer

$("#complete").click(func()(
$("div1").finish();
));

7) dequeue ()

Ta metoda se uporablja za odstranitev naslednje funkcije iz čakalne vrste in se nato uporablja za izvajanje funkcije. Čakalna vrsta je ena ali več funkcij, ki v cevovodu čakajo, da se zaženejo. Ta metoda uporabe se uporablja skupaj z metodo čakalne vrste. En element ima lahko več čakalnih vrst. Čakalna vrsta fx je najpogostejša, ki je tudi privzeta vrsta.

Sintaksa

$(selector).dequeue(NameOfQueue)

Primer

$("label").queue(func()(
$("").css("background-color", "black");
$("div").dequeue();
));

8) slideDown ()

To je še ena uporabna metoda v jQuery, ki se uporablja za drsenje navzdol ali prikazovanje izbranih seznamov elementov. Tu je treba opozoriti, da deluje tudi na elemente, ki so v skriti obliki, vrsta zaslona pa je v primeru CSS prikazana kot nobena, vidnosti pa ne bo treba skrivati.

Sintaksa

$(selector). slideDown (duration, easing, callback)

Primer

$("label").queue(func()(
$("p").slideDown();
));

9) slideUp ()

Metoda slideUp () se uporablja za skrivanje vseh

izbrani elementi. Elementi, ki so v skriti obliki, sploh ne bodo prikazani. To torej ne vpliva na postavitev strani.

Sintaksa

$(selector).slideUp(duration, easing, callback)

Primer

$("label").queue(func()(
$("p").slideUp();
));

10) slideDown ()

V nasprotju z metodo slideUp () se ta metoda uporablja za prikaz vseh skritih

elementi. Ta metoda slidedown () deluje na vse elemente, ki so tudi v primeru jQuery metod povezani s skritimi metodami, ime pa je prikazano tudi v CSS, vendar vidnost ni skrita.

Sintaksa

$(selector).slideDown(duration, easing, callback)

Primer

$("label").queue(func()(
$("p").slideDown();
));

11) Preklopi ()

Ta metoda se uporablja za preklop med prikazom in skrivanjem različnih

na osnovi elementov. Ta metoda se uporablja za preverjanje vidnosti elementov. Metoda show () se uporablja za zagon tudi, ko je element skrit. Hide () se izvaja tudi, ko je element viden. Obe metodi kažeta in skrijeta v kombinaciji ustvari učinek preklopa in zato metoda toggle ().

Sintaksa

$(selector).toggle(duration, easing, callback)

Primer

$("label").queue(func()(
$("p").toggle();
));

12) slideToggle ()

Ta metoda se uporablja za preklop med funkcijo slideUp () in slideDown () za vse elemente, ki temeljijo na odstavku. Ta metoda se uporablja za preverjanje izbranih elementov glede vidnosti. SlideDown () je funkcija, ki jo je mogoče videti, ko se element skriva. Nasprotno je element slideUp () tisti, ki ga je treba zagnati, če je element viden.

Sintaksa

$(selector).slideToggle(duration, easing, callback)

Primer

$("label").queue(func()(
$("p").slideToggle();
));

jQuery nam omogoča, da na spletno stran dodamo učinke z zagotavljanjem številnih funkcij, ki jih je mogoče uporabiti na različnih izbirnikih. Na vas je, kako želite, da bodo vaša spletna mesta videti bolj zapolnjena z učinki. Upam, da vam je bil naš članek všeč. Za več takšnih člankov spremljajte naš blog.

Priporočeni članki

To je vodnik za učinke jQuery. Tu smo razpravljali o različnih vrstah metod jQuery Effects s ​​skladnjo in primerom. Če želite izvedeti več, si oglejte tudi naslednji članek -

  1. Uporabe JQueryja
  2. jQuery alternative
  3. MySQL poizvedbeni ukazi
  4. Kaj je postopek v SQL?
  5. jQuery querySelector

Kategorija:

Razvoj programske opreme