Wicked CSS - Knižnica horúcej animácie v Čistom CSS3

Vďaka CSS3 si môžete vytvoriť nejaké bláznivé animácie na webe. Tie môžu pracovať medzi všetkými prehliadačmi a prvkami stránky ovládanie navigačných položiek, rozbaľovacieho zoznamu, kariet, ktoré ste mi pomenovali.

V skutočnosti môžete tieto kódy generovať dynamicky pomocou animačných nástrojov. Ale tieto sú v porovnaní s plnohodnotnou animačnou knižnicou pomerne obmedzené.

Wicked CSS je najnovšia knižnica tohto druhu. To mi pripomína čoskoro Animate.css, ktorý bol pomerne jednoduchý a rudimentárny, ale mohli by byť použité v takmer každej webovej stránke.

Pozrite sa na domovskú stránku pre živé demo spolu so zoznamom všetkých podporovaných animácií. Od písania tohto článku počítať 24 celkových animačných štýlov od diapozitívov po rotácie a pulzujúce / skákacie efekty.

Mnohé z týchto animácií sú jednorazové prvky, ktoré slúžia na zobrazenie prvku (alebo z pohľadu). Je to užitočné pre stránky s animáciami s posunom na zobrazenie, ktoré sú zamerané na konkrétne prvky stránky.

Ale môžete tiež použite na zobrazenie (alebo skrytie) ďalších položiek stránky ako sú rozbaľovacie ponuky, vyhľadávacie panely, skryté registračné formuláre alebo čokoľvek iné. Tu je malý zoznam animácií, z ktorých si môžete vybrať:

• Triasť
• Priblížiť / oddialiť
• Posúvajte nahor / nadol
• Fade in / out
• Vjazd / odchod
• Bounce a pop
• Otváranie / vypínanie kruhov

Všetky tieto animačné štýly sú navrhnuté pre jedno použitie. Môžu sa nazývať viackrát na stránku a na prvok, ale to nie sú opakujúce sa animácie.

Namiesto toho ich použijete na základe kliknutia používateľa, pohybujúceho sa kurzora alebo prstom. Môžu byť tiež použité na tlačidlách CTA pre pulzujúce / pulzujúce efekty, ale nevyžadujú si funkciu načasovania jazyka JavaScript.

Pozrite sa na stránku s príkladmi pre živú ukážku a ďalšie podrobnosti. Nájdete tu aj kompletnú dokumentáciu na hlavnej stránke spolu s repo GitHub.

Wicked CSS je novšia knižnica, takže ešte nemá žiadne obrovské výsledky. Ale knižnica je stabilná a pravdepodobne bude okolo rokov.