CSS jahat - Animasi Animasi Baru yang Hot dalam CSS3 Tulen
Terima kasih kepada CSS3 anda boleh membina beberapa animasi gila di web. Ini boleh bekerja di semua pelayar dan unsur halaman untuk mengawal item navigasi, jatuh turun, tab, anda namakannya.
Malah anda bahkan boleh menghasilkan kod-kod ini secara dinamik menggunakan alat animasi. Tetapi mereka agak terhad berbanding dengan perpustakaan animasi sepenuhnya.
CSS jahat adalah perpustakaan yang terbaru. Ini mengingatkan saya pada awal Animate.css yang agak mudah dan asas, namun boleh digunakan di laman web yang cukup banyak.
Ambil mengintip di laman utama untuk demo hidup bersama dengan senarai semua animasi yang disokong. Sebagai penulisan artikel ini saya menghitung 24 gaya animasi total dari slaid ke putaran dan kesan pulsing / melantun.
Kebanyakan animasi ini adalah satu ciri yang digunakan untuk membawa unsur ke dalam pandangan (atau di luar pandangan). Ini berguna untuk halaman dengan animasi tatal-to-view yang menyasarkan unsur halaman tertentu.
Tetapi anda juga boleh gunakan ini untuk menunjukkan (atau menyembunyikan) item halaman tambahan seperti menu tarik turun, bar carian, borang pendaftaran tersembunyi atau apa-apa lagi. Berikut adalah senarai kecil animasi yang anda boleh pilih dari:
- Shake
- Zum masuk / keluar
- Luncurkan atas / bawah
- Pudar masuk / keluar
- Rolling in / out
- Bounce dan pop
- Putaran pekeliling masuk / keluar
Semua gaya animasi ini direka untuk satu kegunaan tunggal. Mereka boleh dipanggil berbilang kali setiap halaman dan setiap elemen, tetapi ini tidak mengulangi animasi.
Sebaliknya anda akan menggunakannya berdasarkan pada klik, hover, atau kesan sapu pengguna. Mereka juga boleh digunakan pada butang CTA untuk kesan pulsing / throbbing, tetapi itu memerlukan fungsi pemasaan JavaScript.
Lihat halaman contoh untuk pratonton langsung dan beberapa butiran lanjut. Anda juga akan mendapati dokumentasi lengkap di laman utama bersama dengan repo GitHub.
CSS jahat adalah perpustakaan yang lebih baru sehingga tidak mempunyai banyak lagi. Tetapi perpustakaan itu stabil dan ia mungkin akan berlaku untuk beberapa tahun akan datang.