Bagaimana Cara Membuat efek zoom Pada Gambar Blog
1. Login ke Blogger--> Dashboard --> Template
2. Jangan lupa Download template untuk antisipasi ada kesalahan
3. sekarang klik Edit HTML
4. Tekan ctrl F, cari kode ]]></b:skin> dan pastekan kode berikut dibawah atau sesudah kode tersebut.
.zoomeffect img{
-webkit-transform:scale(0.8);
-moz-transform:scale(0.8);
-o-transform:scale(0.8);
-webkit-transition-duration: 0.5s;
-moz-transition-duration: 0.5s;
-o-transition-duration: 0.5s;
opacity: 0.7;
margin: 0 10px 5px 0;
}
.zoomeffect img:hover{
-webkit-transform:scale(1.1);
-moz-transform:scale(1.1);
-o-transform:scale(1.1);
opacity: 1;
}
5.Simpan Template
Bagaimana Cara menerapkannya pada Gambar.
Ketika anda upload sebuah gambar,beralih pada HTML mode dan rubah class ke zoomeffect
Contoh: class Gambar Anda di post editor adalah <div class = "seperator", ubah ke <div class = "zoomeffect"
Jika Anda ingin menambahkannya ke bagian lain di blog Anda, Anda dapat menggunakan kode berikut.
<a class="zoomeffect" href="URL GMBAR ANDA/" target="_blank">
<img src = "http: // URL GAMBAR" /> </a>
Ganti URL Gambar dengan link gambar yang ingin anda beri effect.
Semoga Bermanfaat.