Laman » Toolkit » Tuesday.css adalah Perpustakaan Animasi Paling Hangat Sekarang

    Tuesday.css adalah Perpustakaan Animasi Paling Hangat Sekarang

    Sekarang anda harus sudah biasa Animate.css sebagai perpustakaan animasi utama antara pereka web.

    Tetapi ada anak baru di blok bernama Selasa, dan ia mengambil animasi web dengan kekerasan.

    Perpustakaan baru ini tidak banyak berbeza dalam format atau pelaksanaan. Tetapi hari Selasa datang dengan segelintir animasi CSS baru bahawa anda tidak dapat mencari tempat lain.

    Kesan-kesan baru ini lebih bersifat halus jadi mereka benar-benar campuran ke halaman dengan baik. Inilah a senarai kecil kesan anda boleh memilih dari:

    • Pudar & berkembang
    • Pudar & mengecut
    • Setem ke bawah & melantun
    • Angled angled
    • Jatuhkan dari kiri / kanan
    • Skuasy / regangan
    • Hinge

    Jika anda pergi melalui senarai ini di halaman demo, anda akan melihat bahawa semua kesannya ada satu perkara yang sama: fizik.

    Mereka semua berasa sangat realistik terhadap asas-asas fizik, dan mereka seolah-olah mematuhi undang-undang graviti. Tiada satu daripada animasi ini adalah over-the-top atau melampau. Mereka halus lagi ketara dan lebih penting lagi, mereka boleh dipercayai.

    Saya fikir Selasa adalah salah satu perpustakaan animasi CSS yang terbaik kerana ia membentangkan pandangan realistik animasi web.

    Kita tidak boleh merancang kesan antara muka gila yang menonjol seperti ibu jari sakit. Kehalusan sentiasa nama permainan kerana ia mewujudkan rasa interaktiviti dari mana-mana input pengguna sama ada ia klik atau skrol.

    Masalahnya selalu menulis animasi ini dari awal dan membuat mereka kelihatan betul. Tetapi kini dengan hari Selasa kebimbangan anda boleh terbang keluar dari pintu.

    Hanya muat turun salinan dari GitHub dan tambahkan .css fail ke halaman anda. Anda boleh sebenarnya gunakan versi CDN terus dari GitHub jika anda tidak mahu memuat turun sesuatu secara tempatan.

    Sebaik sahaja ini ditambahkan ke halaman web anda, hanya tambah .bernyawa kelas bersama-sama dengan mana-mana kelas proprietari disenaraikan dalam repo GitHub. Kod anda mungkin kelihatan seperti ini:

     

    Ia hari Selasa.

    Lihat sahaja dokumentasi penuh untuk melihat senarai semua kelas animasi masuk / keluar.

    Jika anda bekerja dengan JavaScript, anda juga boleh tambah kelas-kelas ini secara dinamik pada acara klik / hover. Dengan cara ini anda boleh menambah kelas berayun hanya apabila pengguna mengklik butang, yang akan kelihatan bernyawa pada klik.

    Terdapat begitu banyak yang boleh anda lakukan dengan hari Selasa, dan ia benar-benar Animate.css baru untuk animasi UI pragmatik.

    Ambil mengintip di halaman demo untuk melihatnya hidup dalam tindakan, dan anda boleh belajar lebih banyak dengan membaca melalui mereka “dalam pembikinan” jawatan yang bercakap mengenai bagaimana pasukan Shakr dibuat Selasa.