Ustvarite enojne elemente Spinners in Loaders z CSSPIN

Z CSS3 lahko ustvarite nekaj neverjetnih stvari, od vnosna polja po meri do spustni meniji in celo vektorska grafika. Te tehnike so hitro prehitevanje JavaScripta, razvijalcem olajša izdelavo boljših uporabniških izkušenj.

Ena najtežjih stvari za gradnjo je nalaganje animacije spinnerja vendar je sodobna animacija CSS to celo zelo preprosta.

Če želite prihraniti čas za gradnjo iz nič, lahko uporabite knjižnico, kot je CSSPIN s tonami vnaprej določeni predilniki po meri. Vse te animacije so prosto klonirane in popolnoma odprte, tako da imate popoln dostop da uredite kodo, kot želite.

Postavitev centrifuge s to knjižnico je lahkotna. Ti samo kopirajte knjižnico CSS nato v svojo stran dodajte elemente HTML po meri kjer koli želite.

Ti po meri uporabljeni spinnerji en element HTML ustvarite učinek animacije. To je ogromno, ker je grafični in animacijski učinek zgolj preko razredov CSS.

In ker imate dostop do izvorne kode lahko zamenjajte oblike, barve, velikosti in hitrost animacije da bolje ustrezajo vašim projektom.

Samo zabeležite kodo ne uporablja sintakse LESS, zato morate biti seznanjeni s tem jezikom za predobdelavo, da bi naredili večje spremembe.

Ampak, lahko najdete veliko navadni primeri CSS na glavni demo strani, skupaj z preprosta navodila na strani GitHub.

Če ste seznanjeni z npm ali Bower to so alternativne metode za namestitev knjižnice.

Ne glede na to, kako ga namestite, je to odlična knjižnica CSS animacij za delo. To naj bi bilo popolnoma modularna z obilico prostora za nove vrtalnike, nove animacije in prilagoditve drugih razvijalcev.

Če želite izvedeti več in prebrskati vso dokumentacijo, si oglejte Repo CSSPIN na GitHubu. Ustvarjalec je naredil tudi majhno setup video ki si jih lahko ogledate spodaj.