Le animazioni con CSS sono oramai diventate fondamentali perché, oltre ad offrire numerosi vantaggi rispetto alle animazioni javascript, sfruttano l’accelerazione hardware che, se è difficile da notare su un computer desktop, diventa essenziale quando la visualizzazione è fatta su un browser mobile.
Il problema delle animazioni fatte con solo CSS è che queste vengono immediatamente attivate al caricamento della pagina od al realizzarsi di un evento, e non è comunque possibile accodarle od innescarle quando un’altra animazione è stata completata.
Ed è proprio qui che entra in gioco Animo.js, è un piccolo ma potente strumento per la gestione delle animazioni CSS.
Include numerose caratteristiche tra cui:
- le animazioni Stack
- la possibilità di creare una sfocatura cross-browser
- la possibilità di impostare funzioni di callback al termine dell’animazione
Animo.js include al suo interno la stupefacente libreria animate.css di Dan Eden, che fornisce più di 60 bellissime animazioni (ed è utilizzata, tra gli altri, da Electronics Art per ghostgames.com, Foursquare, Hipstamatic e Disney), alle quali sono state aggiunte un paio di animazioni di supporto.
Animo.js dipende solo da jQuery 2.0 o successiva ed è il suo utilizzo è estremamente semplice.
Il sorgente include, oltre ad animate.css, un helper per le animazioni realizzato appositamente per Animo, ma è comunque possibile utilizzare qualsiasi altro foglio di stile per le animazioni.
Potete vedere alcune demo e trovare il link per il dowload del pacchetto al sito http://labs.bigroomstudios.com/libraries/animo-js
