Mājas lapa » UI / UX » Gluda pilna lapa Ritināšana ar jQuery Plugin viewScroller.js

    Gluda pilna lapa Ritināšana ar jQuery Plugin viewScroller.js

    JavaScript ritināšanas efekti ir bijis apmēram gadus ar desmitiem lielu bibliotēku, no kurām izvēlēties. Bet jauns sāncensis šajā jomā ir viewScroller.js.

    Šī ļoti mazā, bet spēcīgā bibliotēka var veidoties vienas lapas izkārtojumi to ritiniet kā blokus ar vienu velciet ritināšanas ritenīti (vai skārienpaliktni). Tas rada kontrolētu izkārtojumu, kur ritinātāji pārvieto lietotāju, izmantojot atsevišķas lapas sadaļas pikseļu precizitāte.

    Protams, šī ir pilnīgi bezmaksas bibliotēka pieejams GitHub un viegli uzstādīt ar Bower vai npm.

    Tomēr viewScroller.js ir ne neatkarīga JavaScript bibliotēka. Tas paļaujas uz jQuery un diviem īpašiem spraudņiem: jQuery peles ritenis un jQuery Easing. Šie ir abas ir nepieciešamas lai pareizi darbotos ritināšanas efekti.

    Tas var kavēt viewScroller vērtību, jo tas prasa dažas JS bibliotēkas tikai darboties. Bet, ja jūs jau lietojat jQuery, tad tas ir ne-brainer. viewScroller.js piedāvā vienkāršāko metodi, lai iegūtu vienas lapas ritināšanas tīmekļa lietotne darbojas bez daudz koda.

    Tomēr tas notiek, izmantot ļoti detalizētas klases un ID lai izveidotu ritināšanas efektu. Jūs varat rediģēt šīs klases savā CSS failā vai tos pārrakstīt pamatkodā. Jūs atradīsiet pilns saraksts repo lapā ar klases nosaukumi un noklusējuma iestatīšanas dati.

    Vienkāršākais veids, kā sākt, ir skenēšanas skrituļa ​​demo klonēšana. Viņiem ir viens ar labo sānu joslu, otrs ar kreiso sānu joslu un viens ar diviem sānjoslām, kas vidū satur vidējo saturu.

    Ja jūs esat labi ar jQuery darbināmu tīmekļa lietotni, tad viewScroller ir fantastiska bezmaksas bibliotēka. Tas ir nepieciešams diezgan maz atkarību bet tie nedrīkst būt grūti konfigurējami.

    Palieciet uz tiešraides demonstrācija un redzēt, ko jūs domājat. Ja jums patīk UX un ritināšanas uzvedība, izpildiet GitHub iestatīšanas rokasgrāmata lai sāktu darbu.