Ehita oma lehekülje kerimisefektid Roll.js-iga

Veebis leidub kümneid kerimisraamatuid. Enamik neist on kirjutatud JavaScriptis ja neil on oma efektid, mida saate ühe lehekülje skeemide, liikuvate animatsioonide ja nii palju muuta.

Aga kuidas oma kerimisefektide kodeerimine? Või mis siis, kui soovite lihtsalt lihtsat viisi, kuidas jälgida, kui kaugele lehele, mida kasutaja on kerinud, on?

Roll.js on otsitav raamatukogu. See avatud lähtekoodiga skript on hull väike ja väga lihtne kasutada. Seda saab teha mõne JavaScripti reaga. Ja mis kõige parem, see ei sunni teid tegema midagi konkreetset, vaid pigem annab teile tööriistad luua oma kohandatud kerimisfunktsioonid.

Selle raamatukogu eesmärk on aidata arendajatel oma kerimisefekte struktureerida ilma palju pingutusteta.

Kui vaatate GitHubi peamist repot, leiate terve häälestusjuhendi, millel on mõned näited. Sa saad käivitage funktsioonid, et helistada kasutaja kaugusele, või erinevatele “paneelid” lehel.

Need toimivad kõige paremini üheleheküljelistel paigutustel, kuid saate Roll.js'i kasutada nii palju.

Ühe funktsioonikõne puhul saate andmeid tõmmata iga kerimisega, mis sisaldab:

• Lehekülje samme kokku (kui on olemas).
• Kogu% keritud leht allapoole.
• Praegune asukoht leheküljel pikslites.
• Kokku vaatepordi kõrgus vastavalt seadme suurusele.

See toimib ka hüppelinkidega, mis viivad kasutajaid lehekülje teatud osade alla (või üles).

Kuid te võite leida palju neid funktsioone ka teistes raamatukogudes. Mis muudab Roll.js nii eriliseks?

Osa sellest on süntaks, kuid suur müüja siin on kogu raamatukogu suurus 8KB kaevandamisel. Selline üksikasjalik kerimisraamatukogu on päris väike!

Näete, kuidas see toimib peamisel demo lehel ja saate isegi laadige Roll.js lähtekoodi, et neid demosid ise kaevata.

GitHubist saab tõmmata kõike alates live-demodest ja toores raamatukogu failidest ning neid on väga lihtne töödelda.

Aga kui teil on küsimusi, soovitusi või soovid oma tänu awesome'i raamatukogu eest jagada, saate salvestada sõnumi loojale @williamngan.