Corsi on-line

Scrollorama per effetti di scrolling con jQuery

Scrollorama è il nome di un’interessante estensione per il framework JavaScript jQuery dedicata alla generazione semplice e veloce di effetti di scrolling a carico delle pagine Internet; il plugin opera in pratica sulla base di una divisione degli elementi di pagina in diversi blocchi, l’utilizzatore potrà poi animare tramite scrolling i diversi elementi sulla base della posizione della finestra del browser.

Gli effetti di scrolling e le animazioni possono essere migliorati e personalizzati attraverso regole di stile e proprietà CSS, sarà inoltre possibile impostare e definire la durata delle animazioni e settare le posizioni relative d’inizio e fine dello scrolling.

Sono supportate alcuni effetti di transizione come per esempio:

  • fade in;
  • fly in;
  • rotazione;
  • zoom.

Utilizzare Scrollorama è molto semplice, basta includere la relativa libreria subito dopo l’embed di jQuery e inizializzarla nel modo seguente:

$(document).ready(function() {
    var scrollorama = $.scrollorama({
        blocks:'.scrollblock'
    });
});

Dopodiché non si dovrà fare altro che dichiarare un elemento target per lo scrolling definendone le proprietà:

scrollorama.animate('#example1',{
    duration:400, property:'opacity'
})

Per il download dell’estensione e la relativa documentazione sono disponibili le relative pagine del sito ufficiale del progetto.

Post correlati
I più letti del mese
Tematiche