Sujuv täisleht kerimine koos jQuery pluginivaatesScroller.js

JavaScripti kerimisefektid on olnud aastaid umbes kümneid suurepäraseid raamatukogusid. Kuid uus väljakutse selles valdkonnas on viewScroller.js.

See väga väike, kuid võimas raamatukogu saab ehitada ühe lehe paigutus seda kerige plokkidena üks kerimisratast (või puuteplaati). See loob kontrollitud paigutuse, kus kerimine liigutab kasutajat lehe üksikute osade kaudu pikslitihedus.

Loomulikult on see täiesti tasuta raamatukogu saadaval GitHubis ja lihtne paigaldada Bower või npm.

ViewScroller.js on aga mitte sõltumatu JavaScript-raamatukogu. See tugineb jQueryle ja kahele konkreetsele pluginale: jQuery Mousewheel ja jQuery Easing. Need on mõlemad on vajalikud leidke kerimisefektid korralikult.

See võib takistada viewScrolleri väärtust, kuna see nõuab mõningaid JS-i raamatukogusid, et see toimiks. Aga kui sa juba kasutad jQuery-d, siis see on no-brainer. viewScroller.js pakub lihtsamat meetodit a ühe lehe kerimine veebirakenduses töötab ilma palju koodita.

See aga toimib, kasutage väga üksikasjalikke klasse ja ID-sid kerimisefekti loomiseks. Sa saad muutke neid klasse oma CSS-failis või need üle kirjutada põhikoodi. Leiad a täielik nimekiri repo lehel klassi nimed ja vaikeseadistusandmed.

Lihtsaim viis alustada on viewScrolleri demode kloonimine. Neil on üks parem külgriba, teine ​​vasakpoolse külgriba ja üks kahe külgribaga, mis sisaldavad keskel sisu.

Kui sa oled õigesti jQuery-toega veebirakendusega, siis viewScroller on fantastiline tasuta raamatukogu, mida kasutada. See vajab üsna vähe sõltuvusi kuid neid ei tohiks olla raske konfigureerida.

Pöörake pilgu peale live demo ja vaata, mida sa arvad. Kui sulle meeldib UX ja kerimiskäitumine, järgige seda GitHubi häälestusjuhend alustada.