Smooth derularea paginii complete cu jQuery Plugin viewScroller.js

Efecte de derulare JavaScript au fost în jur de ani de zile cu zeci de biblioteci mari de a alege de la. Dar un nou contender în domeniu este viewScroller.js.

Această bibliotecă foarte mică dar puternică se poate construi o singură pagină acea parcurgeți ca blocuri cu o singură atingere a roții de defilare (sau a touchpad-ului). Acest lucru creează un aspect controlat în cazul în care derulează mutarea utilizatorului prin secțiunile individuale ale unei pagini pixeli-precizie strans.

Bineînțeles, aceasta este o bibliotecă complet liberă disponibil pe GitHub și ușor de instalat cu Bower sau npm.

Cu toate acestea, viewScroller.js este nu o bibliotecă independentă JavaScript. Se bazează pe jQuery și două pluginuri specifice: jQuery Mousewheel și jQuery Easing. Acestea sunt ambele necesare pentru a obține efectele de defilare să funcționeze corect.

Acest lucru poate împiedica valoarea lui ViewScroller deoarece necesită câteva librării JS doar pentru a funcționa. Dar dacă deja utilizați jQuery, atunci este un proces fără minte. ViewScroller.js oferă cea mai simplă metodă de a obține o o singură pagină de derulare a aplicației web fără prea multe coduri.

Cu toate acestea, folosiți clase foarte detaliate și ID-uri pentru a crea efectul derulării. Poti editați aceste clase în propriul fișier CSS sau suprascrie-le în codul de bază. Veți găsi a lista plina pe pagina de repo cu nume de clasă și datele de configurare implicite.

Cea mai simplă cale de a începe este prin clonarea demo-urilor de vizualizare a scroll-urilor. Acestea au unul cu o bară laterală dreaptă, alta cu o bară laterală din stânga și una cu două bare laterale care conțin sandwiching în mijloc.

Dacă sunteți în regulă cu o aplicație web alimentată de jQuery, atunci viewScroller este o bibliotecă fantastică gratuită de folosit. Are nevoie destul de puține dependențe dar acestea nu ar trebui să fie greu de configurat.

Luați o privire la live demo și vezi ce crezi tu. Dacă vă plac comportamentul UX și comportamentul de defilare, urmați Ghid de instalare pe GitHub pentru a incepe.