# 12: Soittotoiminnot - CSS-temppuja

Anonim

Kaikkien suosikki: konseptivideo aika! Soittopyynnöt ovat tärkeä käsite JavaScriptissä. Ne ovat toimintoja, joita kutsutaan, kun toiminto on suoritettu loppuun. Luo sitten koodi ja ajoitus koodillemme.

Otetaan esimerkiksi animaatio, jota käytimme edellisessä videossa. Animaatioiden suorittaminen vie aikaa. Entä jos haluat, että jotain muuta tapahtuu heti, kun animaatio on valmis? Täytyykö sinun tehdä setTimeoutsama pituus kuin animaatio? Ei. jQuery antaa meille takaisinsoittotoimintoja, joita käytetään juuri tähän tarkoitukseen.

Ne ovat tyypillisesti lisäparametri, jonka välitämme menetelmälle. Animaation tapauksessa välitetään funktio viimeisenä parametrina. Tämä on takaisinsoittotoiminto, ja sitä kutsutaan, kun animaatio on valmis.

$("#element").animate(( // stuff to animate ), function() ( // callback function ));

Se näyttää ehkä hieman funky, mutta pohjimmiltaan me vain teemme:

.animate(a, b)

Missä aon ominaisuuksien ja arvojen kohde, ja bse on takaisinsoittofunktio.

Mutta viimeisestä videosta tiedämme, että animaatio voi myös ottaa ajoitusparametrin, joka määrittää, kuinka kauan animaatio kestää. Minne se menee? Se on valinnainen parametri, aivan kuten soittopyyntö. Jos haluaisimme käyttää sitä, laittaisimme sen keskelle, niin pohjimmiltaan:

.animate(propertiesObject, duration, callback);

Ja on myös toinen valinnainen parametri, merkkijono, jonka voimme välittää määrittämään kevennysarvon.

.animate(propertiesObject, duration, easing, callback);

jQuery sattuu olemaan viileä ja älykäs näistä valinnaisista parametreista. Jos jätät kaksi keskimmäistä väliin ja vain välität soittopyynnön, se voi kertoa, mitä ohitat, on funktio, ei numero tai merkkijono, joten se tietää, että tarkoitat soittopyyntöä. Sinun ei tarvitse antaa väärennöksiä tai mitään muuta. Se on vain hyvä API-suunnittelu!

Kun tarkastelet jQuery-dokumentaatiota, he näyttävät sen näin:

.animaatti (ominaisuudet (, kesto) (, keventäminen) (, täydellinen))

Sitten heti selittää odotetut tyypit.

Mutta joka tapauksessa, takaisin takaisinsoittoihin. Voit saada melko sisäkkäin. Kuvittele, että soitat toisen animaation takaisinsoittotoimintoon, ja sillä on oma soittopyyntö. Se on täysin kohtuullista, koska haluat ehkä tehdä monivaiheisen animaation. Sinun tarvitsee vain pysyä järjestyksessä.

Katso Chris Coyierin (@chriscoyier) kynä 450c5810be27a9a8946cb8012cbd1213 CodePenistä

Käytämme vain animaatiota tässä esimerkkinä. Ehkä vieläkin yleisempi soittopyyntötoimintojen käyttö on Ajax. Ajax on silloin, kun selain pyytää toista resurssia päivittämättä sivua. Se voi viedä täysin tuntemattoman ajan. Se riippuu kaistanleveydestä ja viiveestä, tiedoston koosta, virhetiloista ja kaikenlaisista asioista. Et todennäköisesti voi tehdä mitään kyseisen Ajax-pyynnön kanssa, ennen kuin saat jotain takaisin tai muuten lisätietoja. Soittotoiminnot ovat täydellisiä siihen, ja tulemme siihen myöhemmin.