Membuat Berbagai Animasi loading dengan CSS

Hallo teman-teman, pada kesempatan kali ini saya akan memberikan satu tips untuk membuat berbagai macam animasi loading hanya dengan HTML dan CSS3. Sekarang ini sudah banyak sekali website yang mengedepankan fitur interaktif yang unik agar website terkesan tidak membosankan.

Jika kalian pernah melihat efek animasi loading pada sebuah website, apa yang kalian pertama kali pikirkan? Website ini menggunakan Flash? atau JQuery? atau animasi Canvas pada HTML?

Yang perlu kalian ketahui bahwa CSS juga bisa membuat sebuah animasi. Animasi pada CSS adalah berbentuk perubahan sebuah objek yang terjadi secara terus menerus atau bersifat looping.

Animasi yang dibuat dengan CSS juga terlihat sangat halus seperti saat kalian menggunakan flash, hanya saja pada animasi CSS tidak bisa bersifat interaktif. kecuali jika dipadukan dengan Javascript atau jquery.

Berikut adalah contoh animasi loading ketika menggunakan css.