Wicked CSS - kuuma uusi animaatiokirjasto Pure CSS3 ssa
CSS3: n ansiosta voit rakentaa hulluja animaatioita verkossa. Nämä voivat toimivat kaikilla selaimilla ja sivuelementeillä ohjata navigointikohtia, pudotusvalikkoja, välilehtiä, nimeät sen.
Itse asiassa voit jopa luoda näitä koodeja dynaamisesti animaatiotyökalujen avulla. Mutta ne ovat melko rajalliset verrattuna täysimittaiseen animaatiokirjastoon.
Wicked CSS on uusin kirjasto. Tämä muistuttaa minua varhaisesta Animate.css, joka oli melko yksinkertainen ja alkeellinen, silti sitä voitaisiin käyttää melko paljon millä tahansa verkkosivustolla.
Tutustu kotisivulle live-esittelyyn sekä luettelo kaikista tuetuista animaatioista. Kirjoittaessani tämän artikkelin lasken 24 animaatiotyyppiä yhteensä dioista kiertoihin ja pulssi- ja pomppivaikutukset.
Monet näistä animaatioista ovat kertaluonteisia ominaisuuksia, joita käytetään elementin tuomiseen näkymään (tai poissa näkyvistä). Tämä on kätevää sivuille, joissa on vieritysnäyttö-animaatioita, jotka kohdistuvat tiettyihin sivun osiin.
Mutta voit myös käytä tätä näyttääksesi (tai piilottaa) ylimääräiset sivut kuten pudotusvalikot, hakupalkit, piilotetut kirjautumislomakkeet tai jotain muuta. Tässä on pieni luettelo animaatioista, jotka voit valita seuraavista:
- Shake
- Suurenna / pienennä
- Liu'uta ylös / alas
- Fade in / out
- Rullaaminen sisään / ulos
- Bounce ja pop
- Pyöreä kierto sisään / ulos
Kaikki nämä animaatiotyypit on suunniteltu yhteen käyttöön. Niitä voidaan kutsua useita kertoja per sivu ja elementti, mutta nämä eivät ole toistuvia animaatioita.
Sen sijaan käytät niitä käyttäjän napsautuksen, hoverin tai pyyhkäisyn vaikutuksen perusteella. Niitä voidaan käyttää myös CTA-painikkeissa pulssi- / pulssihyötysuhteisiin, mutta se edellyttää JavaScript-ajoitustoimintoa.
Tutustu esimerkkien sivulle, jossa on suora esikatselu ja joitakin lisätietoja. Löydät myös täydelliset asiakirjat pääsivustosta yhdessä GitHub-repon kanssa.
Wicked CSS on uudempi kirjasto, joten sillä ei vielä ole valtavaa seuraavaa kirjastoa. Kirjasto on kuitenkin vakaa ja se on todennäköisesti jo vuosia.
