Perbedaan Property Transition dan Animation

Halo semuanya kita masih membahas tentang CSS3 dan kali ini kita akan membahas mengenai property transition. Mungkin teman teman pun sudah pernah mencoba property tersebut pada halaman webnya. Tapi disini kita akan bahas lebih detail mengenai fungsi dan kegunaan dari transition. Transition ini merupakan property CSS3 yang memungkinkan kita dapat mengubah nilai property HTML secara halus. Sebelum kita mencoba property transition ini saya akan jelasin dulu sedikit mengenai perbedaan antara transition dan animation. Jadi pada CSS itu ada dua property yang fungsinya mengubah nilai dari property HTML secara halus yaitu yang pertama ada transition dan yang kedua adalah animation. Sebenarnya dua hal ini mirip tapi yang membedakannya adalah keadaan awal dan keadaan akhirnya. Kita akan lihat contoh masing masing property tersebut. Yang pertama adalah transition misalnya jika teman teman lihat animasi yang elemennya bergerak dari posisi sebelah kiri kesebelah kanan.

Nah itu kita sebut keadaan awalnya sebagai yang kiri dan keadaan akhirnya yang sebelah kanan sedangkan pergerakkannya atau animasinya itu kita sebut transisi. Jadi secara konsep pergerakannya disebut animasi tapi property yang kita gunakan adalah transition jika hanya ada keadaan awal dan keadaan akhir saja dan selanjutnya untuk animation kita akan menggerakkannya lebih dari dua keadaan jadi bukan hanya ada keadaan awal dan keadaan akhir tapi ada beberapa keadaan diantaranya. Keadaan diantaranya itu kita sebut sebagai keyframe. Keyframe yang bisa kita tambahkan itu bisa banyak sehingga kita punya beberapa keadaannya diantaranya.

Jadi itulah yang membedakan antara transition dengan animation. Mungkin sampai disini dulu untuk konsep perbedaan antara transistion dengan animation. Terima kasih.

10 September 2016

Webinar Gratis 2024


Selanjutnya Pada Bulan Maret 2024

Sabtu, 09 Maret 2024


10 Bahasa Rekomendasi Untuk Dipelajari di 2024

Python Developer, Data Science, Web Application

Kursus Python Django Web Application 2024 di DUMET School Mini Bootcamp Backend Laravel 11 Bulan Mei 2024 di DUMET School
Webinar Selanjutnya Mei 2024

Minggu, 26 Mei 2024, 09.00-13.00 WIB

(4 Jam Membuat Backend di Laravel 11)

chat