Ehita jahedad CSS-animatsioonid lihtsalt Animista abil

Seal on tonni CSS-animeerimise veebirakendusi võrgus. Kuid väga vähesed on võrreldavad detailsuse ja kasutatavuse tasemega Animista.

See tasuta veebirakendus võimaldab teil genereerida kohandatud CSS-animatsioone ühe nupuvajutusega. Valite eelnevalt kavandatud liikumiste, näiteks slaidide, teisenduste, kiigete ja isegi varju langemise animatsioonide vahel.

Kui olete oma animatsiooni loonud, saate seda teha eksportige kood nagu teiste CSS generaatoritega. Välja arvatud, see kood on palju lihtsam töötada ja isegi kaasas sisseehitatud minifeerimisvahend.

Liides võib alguses tunda segadust, kuid see on ainult sellepärast, kui palju võimalusi teil on!

Te ehitate kohandatud animatsioone kolm peamist sammu ja liidese kasutamine ülevalt alla:

1. Valige liikumisstiil (kiik, slaid, klapp) ülaosas olevast ringist
2. Kohandage seda erinevate liikumistüüpidega allpool
3. Muutke oma animatsioonivalikuid ujuva vasakpoolse valiku ribal

Selle protsessi abil saate muuta animatsiooni kogukestust, leevendust, viivitust, päris palju kõike. Ja kõik töötab puhta CSS3 kaudu, mis muudab selle veelgi muljetavaldavamaks.

Pange tähele ka seda, et kõige paremas navaril saate isegi valida erinevat tüüpi animatsioone.

The vaikimisi on “põhiline” mis võib töötada päris palju (hover, click või vahetu animatsioon). Muud eesmärgid hõlmavad lehekülje tekst, taust animatsioonid ja isegi kohandatud sissepääsu animatsioonid peidetud lehekülje elemendi vaatamiseks.

Mulle meeldib eriti “tähelepanu” lingil ülaosas, millel on nuppude stiilidele mõningaid jahedaid raputamis- ja jitterefekte. Need toimivad suurepäraselt CTA nuppude abil, et haarata tähelepanu ja soodustada kasutajate suhtlemist.

Kui olete korrigeerimise lõpetanud, siis lihtsalt klõpsa väikese konsooli ikoonil eelvaate paneeli paremas ülanurgas.

See avab uue lehekülje oma täieliku CSS animatsiooniklassi koos võtmekaadritega. Valikulised funktsioonid võimaldavad teil koodi minimeerida ja lisada automaatne prefikser mis toetab vanemaid veebibrausereid.

Olen kasutanud tonni kohandatud CSS animatsioonivahendeid ja kahtlemata on Animista seal kõige omaduslikum vahend. See on täiesti tasuta ja natuke keeruline kõigepealt, kuid kui sa mõistad liidese, on see kõige parem generaator.

Proovige lihtsalt külastada kodulehte ja klõpsa “Pane mind proovile”. Samuti saate jagada oma mõtteid ja komplimente veebirakenduse loojaga @ ana108.