Tuesday.css on praegu kuumim animatsiooniraamatukogu
Nüüdseks peaksite olema juba tuttav Animate.css nagu peamine animatsiooniraamatukogu veebidisainerite seas.
Aga sellel plokil on uus poiss Teisipäev, ja selle veebi animatsiooni kasutamine jõuga.
See uus raamatukogu ei ole formaadis või rakenduses väga erinev. Aga teisipäeval on käputäis uued CSS-animatsioonid et sina ei leia kusagil mujalt.
Need uued mõjud on olemuselt palju peenem nii et nad tõesti sulandub hästi lehele. Siin on a väike efektide nimekiri saate valida:
- Fade & expand
- Fade & shrink
- Märgistage ja põrge
- Kaldne kiik
- Lohistage vasakult / paremalt
- Squash / venitus
- Hinge
Kui te lähete läbi selle loendi demo lehel, märkate, et kõik tagajärjed on ühine asi: füüsika.
Nad kõik tunnevad end väga realistlikud füüsika põhitõedele, ja nad näivad järgige gravitatsiooni seadusi. Mitte ükski neist animatsioonidest ei ole üle-ega pealiskaudne. Nad on peen, kuid märgatav ja mis veelgi tähtsam, nad on usutav.
Ma arvan, et teisipäev on üks parimaid kaasaegseid CSS-animatsiooniraamatuid, sest see esitleb realistlik vaade veebi animatsioonile.
Me ei tohiks kujundada hullu liidese efekte, mis paistavad välja nagu valus pöial. Peenus on alati mängu nimi, sest see on loob interaktiivsuse tunnet mis tahes kasutaja sisendist, kas see on klõps või kerimine.
Probleemid on alati olnud nende animatsioonide kirjutamine nullist ja nende otsimine õigesti. Aga nüüd, teisipäeval, võivad teie mured uksest välja sõita.
Lihtsalt alla laadida GitHubist ja lisa .css
faili lehele. Võite tegelikult kasutage CDN versiooni otse GitHubist kui te ei soovi midagi kohalikult alla laadida.
Kui see on teie veebisaidile lisatud, lihtsalt lisage .animeerida
klassi koos kõigi varaliste klassidega GitHub repos. Teie kood näeb välja selline:
See on teisipäev.
Heitke pilk täielik dokumentatsioon et näha loend kõigist in / out animatsiooniklassidest.
Kui töötate JavaScripti abil, saate ka lisage need klassid dünaamiliselt kliki / hoveri sündmustel. Nii saate anime klassi lisada ainult siis, kui kasutaja klõpsab nupul, mis tundub olevat klõpsamisel animeeritud.
Teisipäeval on nii palju, mida saate teha, ja see on tõesti uus Animate.css pragmaatiliste kasutajaliidese animatsioonide jaoks.
Pöörake pilgu peale demo leht et näha, kuidas seda elada, ja saate rohkem teada lugedes läbi nende “tegemisel” postitus mis räägib sellest, kuidas Shakri meeskond teisipäeval loodi.