Hallo teman-teman, Bertemu kembali dengan saya dan masih diwebsite ini. Seperti biasa ya teman-teman, semoga masih diberikan kesehatan dan kebahagiaan agar dapat kembali semangat dalam mencari informasi atau ingin mengupgrade skill didunia website terutama dalam hal desain website.

Pada kesempatan kali ini saya akan membahas tentang Cara Memberikan Nama Animasi pada CSS3. Animasi merupakan salah satu fitur pada versi CSS3.dengan hadirnya fitur ini kita bisa merubah sebuah element dengan tampilan style awal ke tampilan style yang lain. Pada pembahasan kali ini saya tidak membahas tentang animasinya melainkan hanya Cara Memberikan Nama Animasi pada CSS3. Agar dapat dengan mudah dipahami saya harap teman-teman harus sudah mengenal terlebih dahulu tentang CSS.

Oke teman-teman langsung saja ya kita mulai tentang Cara Memberikan Nama Animasi pada CSS3. Pertama-tama teman-teman jalankan/run text-editor yang teman-teman gunakan, kemudian teman-teman ketik/copy script HTML dibawah ini :

Jika sudah, langkah selanjutnya teman-teman tambahkan Style Scriptnya atau Script CSSnya seperti dibawah ini :

Jika sudah maka hasil gabungan dari kedua script diatas menjadi seperti dibawah ini :

Untuk penjelasan mengenai script diatas adalah –moz-animation-name itu merupakan sebuah property animasi untuk memberikan nama pada animasi tsb dan @keyframes adalah suatu frame atau wadah yang menyimpan berbagai animasi objek dengan transisi yang halus atau bisa juga untuk mengatur tahapan animasi. Terlihat descript diatas saya menggunakan from dan to untuk tahapan animasinya.

Dan untuk hasilnya teman-teman dapat melihat gambar dibawah ini :

Cara-Memberikan-Nama-Animasi-pada-CSS3

Jadi kurang lebihnya seperti itu ya teman-teman tentang Cara Memberikan Nama Animasi pada CSS3. Mengenai keyframe dan animasi lainnya nanti akan saya bahas dipembahasan selanjutnya.

Cukup sekian pembahasan kali ini tentang Cara Memberikan Nama Animasi pada CSS3. Semoga dapat bermanfaat buat teman-teman dan sampai bertemu dipembahasan selanjutnya.

Terimakasih