KURAZONE ~ Halo sahabat Kurazer, pada kesempatan kali ini kita akan belajar tentang "Cara Membuat Gambar Postingan Ber-background Image Animation", artikel ini merupakan artikel lanjutan dari artikel sebelumnya, yaitu : Cara Membuat Gambar Postingan Ber-background Gradient Animation.
Cara Membuat Gambar Postingan Ber-background Image Animation
1. Masuk ke Akun Blogger >> Pilih Tema >> Pilih Edit HTML2. Copy kode CSS dibawah ini, lalu letakkan (paste) diatas kode ]]></b:skin>
.kurazonehh{
background: #B2F1FF url(https://sites.google.com/site/sotazone/imghh.png);
padding: 20px;
-webkit-animation: loopnavbg-data-v-c423aec0 350s linear infinite;
animation: loopnavbg-data-v-c423aec0 350s linear infinite;
-webkit-animation: loopnavbg-data-v-c423aec0 350s linear infinite;
animation: loopnavbg-data-v-c423aec0 350s linear infinite;
animation: loopingbackg 350s linear infinite;
}
@-webkit-keyframes loopingbackg
{to{background-position:0 -3e3px}}
@keyframes loopingbackg {to{background-position:0 -3e3px}}
3. Simpan template4. Masuk ke Menu Postingan, lalu edit atau buat entri baru.
Untuk memanggil kode Image Animation nya tinggal menggunakan kode dibawah ini.
<div class="kurazonehh">
<center><img src="https://sites.google.com/site/sotazone/kurazone.png" /></center>
</div>
Hasilnya akan nampak seperti dibawah ini :
NOTE :
- Ganti warna background dengan mengubah kode yang telah ditandai.
- Ganti URL gambar dengan URL gambar milik kalian.
- Sisanya bisa kalian kembangkan sendiri.
*Ekstensi gambar bisa berupa JPG, PNG ataupun GIFSelesai... gampang bangets kan..?!
Itulah informasi mengenai "Cara Membuat Gambar Postingan Ber-background Image Animation", selamat mencoba dan semoga bermanfaat. Goodluck !!