Hvordan stoppe animasjon eller effekt i jQuery

Animasjonene eller effektene gjør innholdet presentabelt for sluttbrukere. JQuery tilbyr forskjellige metoder som Animate (), Fadein (), Fadeout () etc., For å legge til animasjon eller effekt. Hva om du vil stoppe animasjon eller effekt? Du kan gjøre det også, la oss se hvordan?

Stop () -metoden hjelper til med å stoppe animasjon eller effekt i jQuery. Stoppmetoden gir mangfoldig funksjonalitet, som å stoppe animasjonen/effekten øyeblikkelig eller sekvensielt. Denne artikkelen demonstrerer måtene å stoppe animasjonen eller en effekt i jQuery.

Hvordan stoppe animasjon eller effekt i jQuery

Stop () -metoden i jQuery hjelper med å stoppe animasjonen eller effekten som kjører. Syntaksen til stopp () -metoden vises nedenfor.

Velgeren kan være et hvilket som helst HTML -element eller klasse/ID for elementet. Dessuten tilbyr Stop () -metoden to parametere (som er valgfrie, men ikke nødvendige)

• Clearqueue: Den aksepterer boolske verdier (enten sant eller usant) og bestemmer seg for stopp av kommende animasjoner. De falsk(Standardverdi) Verdi leder at bare den nåværende animasjonen vil bli stoppet, og andre kø -animasjoner vil bli startet etterpå. Mens ekte Verdien avslutter animasjonen øyeblikkelig.
• Jumptoend: Standardverdien er falsk, Hvis ekte Verdien tilordnes så avslutter animasjonene og køen blir også tømt.

Ovennevnte syntaks fungerer for forskjellige jQuery -metoder som Fading (), Sliding (), Show (), Hide () også.

Hvordan stoppe animasjoner i jQuery

Denne delen praktiserer noen få eksempler som guider for å stoppe animasjoner i forskjellige scenarier ved hjelp av stop () -metoden.

Eksempel 1: Bruke stop () -metode uten parametere

Ovennevnte kode animerer Div bredde med en hastighet på millisekunder = “5000“. Dessuten stopper metoden Stop () den pågående animasjonen.

Produksjon

Før animering

Etter å ha brukt stopp () -metoden tilfeldig (stopper hvor som helst)

Eksempel 2: Bruke stop () -metode med parametere

Følgende kodepraksis stopper () -metoden ved å bruke begge parametrene. Og verdien av parameteren er satt til ekte.

Ovennevnte kode animerer breddeegenskapen og deretter blir metoden stopp (sant, sant) brukt.

Produksjon

Før du gjør noen handlinger

Etter å ha startet animasjonen, når stopp-animasjonsknappen er klikket på animasjonen slutter umiddelbart.

Hvordan stoppe Fading () -effekten i jQuery

Stop () -metoden i jQuery kan også brukes til å stoppe en effekt. Koden gitt nedenfor utøver den falmende effekten og deretter stopp () -metoden for å stoppe den effekten.

Ovennevnte kode fAdes-Out the Div i hastigheten på 2500 Millisekunder og stoppmetoden brukes til å stoppe Fading Out -metoden.

Produksjon

Før start/stopp av falmingsprosess

Etter at Fading-Out-prosessen er startet, vil stoppknappen klikket på falmingsprosessen stoppes som vist på bildet nedenfor (i vårt tilfelle).

Konklusjon

Stop () -metoden for jQuery brukes til å stoppe animasjonen eller en effekt. Stop () -metoden godtar to parametere, og den kan også brukes uten parametere. Begge parametrene er boolske i naturen, og dermed aksepteres bare sanne verdier. Du ville ha lært anvendelsen av Stop () -metoden for å stoppe animasjonen i jQuery. Dessuten utøves også Stop () -metoden på en fadeout () -metode i jQuery.