Izveidojiet vienpusējus spinnerus un iekrāvējus ar CSSPIN

Jūs varat veidot dažas pārsteidzošas lietas ar CSS3, no pielāgoti ievades lauki uz nolaižamajā izvēlnē un pat vektorgrafika. Šīs metodes ir ātri apiet JavaScript, izstrādātājiem atvieglot labāku lietotāju pieredzi.

Viena no visgrūtākajām lietām ir ielādēt spinner animāciju bet modernā CSS animācija pat padara to diezgan vienkāršu.

Lai ietaupītu laika ēku no nulles, varat izmantot tādu bibliotēku kā CSSPIN tonnas iepriekš noteikti pielāgoti spinneri. Visas šīs animācijas var brīvi klonēt un pilnībā atvērtas, tāpēc jums ir pilnīga piekļuve lai rediģētu kodu, kā vēlaties.

Ar šo bibliotēku ir jāizveido vērpējs. Jūs vienkārši kopējiet CSS bibliotēku tad savā lapā pievienojiet pielāgotus HTML elementus kur vēlaties, lai tie tiktu parādīti.

Šīs pielāgotās spinners izmanto tikai viens HTML elements lai izveidotu animācijas efektu. Tas ir milzīgs, jo grafiskais un animācijas efekts ir izmantojot CSS klases.

Un, tā kā jums ir piekļuve avota kodam, kuru varat nomainiet formas, krāsas, izmērus un animācijas ātrumu lai labāk atbilstu jūsu projektiem.

Vienkārši atzīmējiet kodu izmanto LESS sintaksi, tāpēc jums būs jāzina šī priekšapstrādes valoda, lai veiktu būtiskus labojumus.

Bet jūs varat atrast daudz vienkāršie CSS piemēri galvenajā demonstrācijas lapā kopā ar vienkāršas instrukcijas GitHub lapā.

Ja esat iepazinušies npm vai Bower šie ir alternatīvas metodes bibliotēkas instalēšanai.

Neatkarīgi no tā, kā jūs to instalējat, tā ir lieliska CSS animācijas bibliotēka, kurā strādāt. Tas ir paredzēts pilnībā modulāra ar lielu vietu jauniem spinneriem, jaunām animācijām un pielāgojumiem no citiem izstrādātājiem.

Lai uzzinātu vairāk un pārlūkotu visu dokumentāciju, pārbaudiet CSSPIN repo GitHub. Radītājs arī izveidoja nelielu iestatiet videoklipu jūs varat skatīties tālāk.