Rakenna oma sivusi vieritystehosteet Roll.js n avulla
Löydät kymmeniä vierityskirjastoja kaikkialla verkossa. Useimmat niistä on kirjoitettu JavaScript-muodossa ja niillä on omat vaikutuksensa, jotka voit palauttaa yksittäisten sivujen asetteluihin, vieritykseen liittyviin animaatioihin ja paljon muuta.
Entä koodaavat omia vieritysvaikutuksia? Tai jos haluat vain yksinkertaisen tavan seurata, kuinka pitkälle alaspäin käyttäjä on vierittänyt?
Roll.js on etsimäsi kirjasto. Tämä avoimen lähdekoodin skripti on hullu pieni ja erittäin helppokäyttöinen. Voit saada tämän toimimaan muutaman JavaScript-rivin avulla. Ja mikä parasta, se ei pakota sinua tekemään mitään erityistä, vaan pikemminkin antaa sinulle työkalut luoda omia mukautettuja vieritystoimintoja.
Tämän kirjaston tavoitteena on auttaa kehittäjiä rakentamaan vieritysvaikutuksiaan ilman paljon vaivaa.
Jos tarkastelet GitHub-pääpalvelun pääohjelmaa, löydät koko asennusoppaan, jossa on muutama esimerkki katkelmia. Sinä pystyt Käynnistä toiminnot, jos haluat soittaa, kuinka pitkälle käyttäjä vierittää, tai eri “ruudut” sivulla.
Nämä toimivat parhaiten yhden sivun asetteluissa, mutta voit käyttää Roll.jsia niin paljon.
Yhden toiminnon puhelun avulla voit vetää tietoja jokaisella selaimella, joka sisältää:
- Sivun kaikki vaiheet (tarvittaessa).
- Yhteensä% vierityspainike alaspäin.
- Nykyinen sijainti sivulla pikseleinä.
- Katseluportin koko korkeus laitteen koon perusteella.
Tämä toimii myös hyppylinkkeillä, jotka tuovat käyttäjiä alas (tai ylöspäin) tiettyihin sivun osiin.
Mutta voit löytää paljon näitä ominaisuuksia myös muissa kirjastoissa. Mikä tekee Roll.js: sta niin erikoisen?
Osa siitä on syntaksia, mutta suuri myyjä on koko kirjaston koko 8KB kun se on minifioitu. Se on melko vähäistä niin yksityiskohtaiselle vierityskirjastolle!
Näet, miten tämä toimii tärkeimmällä demo-sivulla ja voit jopa lataa Roll.js-lähdekoodi kaivamaan nämä demot itse.
Kaikista live-demoista ja raaka-kirjastotiedostoista voidaan vetää GitHubista ja ne ovat erittäin helppokäyttöisiä.
Mutta jos sinulla on kysyttävää, ehdotuksia tai haluat kiittää kiitosta mahtavasta kirjastosta, voit kuvata viestin luojalle @williamngan.
