Teman-teman pasti sudah tidak asing lagi dengan kata-kata animasi yah . karena pada jaman sekarang hampir setiap website pasti menggunakan animasi yang sangat kratif dan menarik .
nah pada kesempatan kali ini saya akan sedikit berbagi tentang bagaimana cara membuat animasi Roll in hanya dengan menggunakan CSS3.
Mau tau bagaimana cara membuatnya ? penasaran yah ?? yuk mening ikutin aja di sini , engga bakalan rugi ko 🙂
Yang pertama-tama kita lakukan yaitu membuat script HTMLnya :
nah setelah membuat script HTMLnya, sekarang teman-teman buat script CSSnya seperti ini :
nah property transform berfungsi untuk transformasi element 2D maupun 3D .
sedangkan property opocity berfungsi untuk menampilkan dan menyembunyikan element .
jika sudah coba teman-teman lihat hasilnya di browser , maka akan ada gambar yang munculnya secara perlahan dengan efek Roll in .
oke mungkin sekian untuk artikel hari ini , sampai ketemu di artikel berikutnya , selamat mencoba dan semoga berhasil yah 🙂