Zgradite svoje lastne učinke pomikanja strani z Roll.js
Lahko najdete na ducate drsnih knjižnic po vsem spletu. Večina je napisanih v JavaScriptu in ima svoje lastne učinke, ki jih lahko preoblikujete za posamezne postavitve strani, animacije po zaslugi in toliko več..
Kaj pa? kodiranje lastnih učinkov? Ali kaj, če želite preprosto slediti, kako daleč je stran, na katero se je pomaknil uporabnik?
Roll.js je knjižnica, ki jo iščete. To Odprtokodni skript je noro majhen in super preprost za uporabo. To lahko delate z nekaj vrsticami JavaScripta. In najboljše od vsega, ne prisili vas, da opravljate kaj posebnega, ampak bolj vam daje orodja ustvarite lastne funkcije za pomikanje po meri.
Cilj te knjižnice je pomagati razvijalcem pri oblikovanju učinkov drsenja brez veliko truda.
Če si ogledate glavni GitHub repo, boste našli celoten vodnik za namestitev z nekaj primeri. Ti lahko izvajajo funkcije za klicanje pomika uporabnika, ali drugače “okna” na strani.
To najbolje deluje pri postavitvah na eni strani, vendar lahko uporabite Roll.js za toliko.
Z enim klicem funkcije lahko s posameznim drsnikom potegnete podatke, ki vključujejo:
- Skupno število korakov na strani (če je primerno).
- Skupaj% pomikanje navzdol.
- Trenutni položaj na strani v slikovnih pikah.
- Skupna višina prikaza glede na velikost naprave.
To deluje tudi s skokovskimi povezavami, ki uporabnike znižujejo (ali navzgor) na določene dele strani.
Veliko teh funkcij lahko najdete tudi v drugih knjižnicah. Kaj naredi Roll.js tako posebnega?
Del sintakse je, toda velik prodajalec je celotna velikost knjižnice 8KB ko je minirana. To je precej majhno za tako podrobno drsno knjižnico!
Ogledate si lahko, kako to deluje na glavni demo strani in lahko celo prenesite izvirno kodo Roll.js, da boste sami kopali v te demote.
Vse iz demo posnetkov v živo in iz surovih knjižničnih datotek lahko potegnete iz GitHub-a in z njimi je zelo enostavno delati.
Toda če imate kakršna koli vprašanja, predloge ali želite deliti svoje hvaležnost za čudovito knjižnico, lahko posnamete sporočilo ustvarjalcu @williamngan.
