Pertemuan kali ini saya akan share cara buat animasi pada text dengan menggunakan Keyframe di CSS3. @keyframes itu sendiri adalah suatu frame yang menyimpan berbagai animasi objek yang dimana berfungsi untuk mengatur atau menentukan gerak animasi.

Pertama kita buat struktur tampilan dengan HTML

14-keyframe-1

Ini Bagian Style CSS

14-keyframe-2

Ini bagian tahapan-tahapan untuk merangkai timeline pada animasi.

14-keyframe-3

blurFadeIn, blurFadeIn : itu hanyalah sebuah nama animasi yang menentukan animasi yang dibuat melalui properti @keyframes.

-webkit-  : webkit sendiri berfungsi agar CSS Animasi berjalan pada Browser-browser baru, seperti Google Chrome.

 

Semoga Bermanfaat .

Terima Kasih