CSS malvagio - Una nuova e calda libreria di animazioni in puro CSS3

Grazie a CSS3 puoi creare alcune animazioni pazze sul web. Questi possono funzionare su tutti i browser e gli elementi della pagina per controllare gli elementi di navigazione, i menu a discesa, le schede e il nome.

In effetti puoi persino generare questi codici dinamicamente usando gli strumenti di animazione. Ma quelli sono abbastanza limitati rispetto ad una libreria di animazione completa.

CSS malvagio è la più recente libreria del suo genere. Questo mi ricorda il primo Animate.css che era abbastanza semplice e rudimentale, eppure poteva essere usato praticamente in qualsiasi sito web.

Dai un'occhiata alla home page per una demo dal vivo insieme a un elenco di tutte le animazioni supportate. Al momento della stesura di questo articolo conto 24 stili di animazione totale, dalle diapositive alle rotazioni e agli effetti di pulsazione / rimbalzo.

Molte di queste animazioni sono caratteristiche uniche utilizzate per mettere in vista un elemento (o non vedere). Questo è utile per le pagine con animazioni scroll-to-view che prendono di mira elementi di pagina specifici.

Ma puoi anche usarlo per mostrare (o nascondere) elementi di pagina extra come menu a tendina, barre di ricerca, moduli di iscrizione nascosti o qualsiasi altra cosa. Ecco una piccola lista di animazioni tra cui puoi scegliere:

• Agitare
• Zoom avanti / indietro
• Scorri su / giù
• Dissolvenza in entrata / uscita
• Rolling in / out
• Rimbalza e pop
• Rotazione circolare in / out

Tutti questi stili di animazione sono progettati per un singolo uso. Possono essere chiamati più volte per pagina e per elemento, ma queste non sono animazioni ripetute .

Invece userete questi in base all'effetto click, hover o swipe dell'utente. Possono anche essere utilizzati sui pulsanti CTA per effetti pulsanti / pulsanti, ma ciò richiede una funzione di temporizzazione JavaScript.

Dai un'occhiata alla pagina degli esempi per un'anteprima dal vivo e altri dettagli. Troverai anche la documentazione completa sul sito principale insieme al repository GitHub.

Il CSS malvagio è una nuova libreria quindi non ha ancora un enorme seguito. Ma la biblioteca è stabile ed è probabile che sarà in giro per gli anni a venire.