Tips membuat animasi images artikel Blogspot yang mudah, simple dan works tenan. Animasi kali ini cukup sederhana saja, hanya menampilkan efek berputar dan membesar pada images artikel. Untuk membuat animasi yang lebih menggigit, agan bisa memodifikasi script CSS nya. Untuk membuat animasi sederhana kali ini hanya menggunakan script CSS3 memanfaatkan efek transform, transition, rotate dan translate. Jadi akan memudahkan agan untuk membuat efek yang lebih greged daripada ini.
Bagaimana, setelah melihat screen shoot diatas apakah sudah ada gambaran? pasti sudah ada yah, kalau ga ada, saya bingung juga mau jelasin seperti apa. :v Mungkin dengan praktik langung bisa lebih memudahkan pemahaman.
Ok, Begini langkah-langkahnya:
- Pastikan sudah masuk ke akun blogspot anda, jika belum monggo login dulu. :)
- Pilih menu "Template"
- Pilih "Edit HTML"
- Gunakan CTRL+F, Cari kode ]]></b:skin>
- Kalo sudah ketemu, monggo copy script CSS3 dibawah ini, dan paste tepat diatas kode ]]></b:skin>
.post img {
-o-transition:all 1.5s ease;
-moz-transition:all 1.5s ease;
-webkit-transition:all 1.5s ease;
}
.post img:hover {
-o-transform:scale(1.2) rotate(360deg) translate(0px);
-moz-transform:scale(1.2) rotate(360deg) translate(0px);
-webkit-transform:scale(1.2) rotate(360deg) translate(0px);
-o-transition:all 1.5s ease;
-moz-transition:all 1.5s ease;
-webkit-transition:all 1.5s ease;
}
Terakhir klik Save untuk menyimpan perubahan, demikian artikel tentang Tips Membuat Animasi Images Artikel Blogspot kali ini, semoga bermanfaat. :)
