Scorrimento continuo a piena pagina con jQuery Plugin viewScroller.js

Effetti di scorrimento JavaScript sono in giro da anni con dozzine di grandi biblioteche tra cui scegliere. Ma un nuovo concorrente nel campo è viewScroller.js.

Questa libreria molto piccola ma potente può essere costruita layout a pagina singola quello scorri come blocchi con un colpo della rotella di scorrimento (o del touchpad). Ciò crea un layout controllato in cui le pergamene spostano l'utente attraverso le singole sezioni di una pagina con precisione pixel-stretta.

Naturalmente, questa è una libreria completamente gratuita disponibile su GitHub e facile da installare con Bower o npm.

Tuttavia, viewScroller.js è non una libreria JavaScript indipendente. Fa affidamento su jQuery e due plugin specifici: jQuery Mousewheel e jQuery Easing. Questi sono entrambi richiesti per far funzionare correttamente gli effetti di scorrimento.

Ciò può ostacolare il valore di viewScroller poiché richiede alcune librerie JS solo per funzionare. Ma se stai già usando jQuery comunque è un gioco da ragazzi. viewScroller.js offre il metodo più semplice per ottenere un app web scrolling a pagina singola in esecuzione senza molto codice.

Lo fa, comunque, utilizzare classi e ID molto dettagliati per creare l'effetto di scorrimento. Puoi modifica queste classi nel tuo file CSS o li sovrascrivi nel codice base. Troverete a lista completa sulla pagina di repo con nomi di classe e dati di configurazione predefiniti.

Il modo più semplice per iniziare è vicino clonazione dei demo viewScroller. Ne hanno uno con una barra laterale destra, un altro con una barra laterale sinistra e uno con due barre laterali che racchiudono il contenuto nel mezzo.

Se stai bene con un'app web alimentata da jQuery allora viewScroller è una fantastica libreria gratuita da usare. Ha bisogno alcune dipendenze ma non dovrebbero essere difficili da configurare.

Dai un'occhiata al dimostrazione dal vivo e vedi cosa ne pensi. Se ti piace l'UX e il comportamento di scorrimento, segui il guida all'installazione su GitHub per iniziare.