Crea spinners e caricatori a elemento singolo con CSSPIN

Puoi creare cose incredibili con CSS3, dai campi di input personalizzati ai menu a discesa e persino alla grafica vettoriale . Queste tecniche stanno rapidamente superando JavaScript, rendendo più facile per gli sviluppatori realizzare esperienze utente migliori.

Una delle cose più complicate da realizzare è un'animazione a spinner di caricamento, ma l'animazione CSS moderna lo rende anche piuttosto semplice.

Per risparmiare tempo costruendo da zero, è possibile utilizzare una libreria come CSSPIN con tonnellate di filatori personalizzati predefiniti . Tutte queste animazioni sono libere di clonare e totalmente open-source, quindi hai pieno accesso per modificare il codice come desideri.

Impostare uno spinner con questa libreria è un gioco da ragazzi. Basta copiare la libreria CSS nella tua pagina, quindi aggiungere gli elementi HTML personalizzati ovunque desideri che vengano visualizzati.

Questi spinners personalizzati utilizzano solo un elemento HTML per creare l'effetto di animazione. Questo è enorme perché l'effetto grafico e di animazione è reso puramente attraverso le classi CSS .

E, dato che hai accesso al codice sorgente, puoi sostituire forme, colori, dimensioni e velocità di animazione per adattarlo meglio ai tuoi progetti.

Basta notare che il codice usa la sintassi LESS, quindi è necessario avere familiarità con quel linguaggio di pre-elaborazione per apportare importanti modifiche.

Ma puoi trovare un sacco di semplici esempi CSS nella pagina demo principale, insieme a semplici istruzioni sulla pagina GitHub.

Se hai familiarità con npm o Bower, questi sono metodi alternativi per l'installazione della libreria.

Non importa come viene installato, questa è una fantastica libreria di animazioni CSS con cui lavorare. È pensato per essere completamente modulare con un sacco di spazio per nuovi spinners, nuove animazioni e personalizzazioni da altri sviluppatori.

Per saperne di più e sfogliare tutta la documentazione, controlla il repository CSSPIN su GitHub . Il creatore ha anche realizzato un piccolo video di installazione che puoi guardare qui sotto.

Crea grafica dall'aspetto professionale in modo facile con Canva

Avere una grafica di bell'aspetto è uno dei modi migliori per attirare i lettori sul tuo blog o sito web. Ma inventare una grafica di qualità professionale da soli è più facile a dirsi che a farsi. Il software di progettazione grafica è spesso costoso, complicato o entrambi, e se sei già impegnato a lavorare sul tuo blog, probabilmente non avrai il tempo di insegnarti come usare qualcosa come Adobe Photoshop.Beh,

(Consigli tecnici e di design)

Google Now ti consente di cercare fatti divertenti

Fare ricerche su Google per un argomento non è esattamente il compito più interessante da fare. Probabilmente Google stesso ne è a conoscenza, poiché le persone dietro al motore di ricerca hanno deciso di renderlo un po 'più interessante dando un po' di curiosità alle persone che usano Google per cercare informazioni divertenti sugli esseri viventi .Da qu

(Consigli tecnici e di design)