Hallo teman-teman, kali ini kita akan mencoba membuat animasi superman dengan CSS3. Yap benar, kita akan mencoba membuat animasi superman terbang !. Dengan kemajuan CSS3 sekarang kalian bisa membuat animasi-animasi sederhana dengan hanya menggunakan code html dan css saja. Untuk membuat animasi ini ada beberapa hal yang perlu kalian persiapkan seperti gambar. Pada artikel kali ini saya membuatnya dengan menggunakan 2 buah gambar. Gambar pertama adalah gambar awan sebagai latar belakangnya, dan gambar kedua adalah gambar orang sedang bergaya terbang. Tentu gambar ini bisa kalian ganti sesuai keinginan kalian. Berikut ini gambar yang dipakai pada praktek kali ini.

Setelah sudah kalian bisa coba mengikuti code dibawah ini.

superman.html

style.css

Perlu diperhatikan untuk nama gambar yang dipakai harus sesuai dengan yang ditulis pada css. Setelah disave kalian bisa lihat hasilnya pada browser kalian. Atau bisa juga kalian lihat pada codepen ini.

Mudah bukan ?

Sekian pembahasan mengenai bagaimana cara membuat animasi superman dengan CSS3. Semoga bermanfaat.