Cara Membuat Effect Zoom Pada Gambar Di Blog

Membuat Effect Zoom pada Gambar, hemm, pasti Kalian tidak asing lagi kan. Sebagai contoh Kalian bisa lihat gambar di bawah, coba Kalian sorotkan kursor Kalian ke gambar itu, pasti dengan sendirinya akan membesar.

OK, pasti sudah paham kan, kita masuk ke langkah-langkahnya :

[1]. Login dulu ke Blog Kalian,
[2]. Cari Rancangan --> Edit HTML,
[3]. Trus cari Code ]]></b:skin>,
[4]. Kalo sudah ketemu, Copy dan Paste-kan Code di bawah ini, tepat di atas Code tadi.

.hovergallery 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}.hovergallery img:hover{-webkit-transform:scale(1.1);-moz-
transform:scale(1.1);-o-transform:scale(1.1);box-shadow:0px 0px 30px
gray;-webkit-box-shadow:0px 0px 30px gray;-moz-box-shadow:0px 0px 30px
gray;opacity:1}

[5]. Kalo sudah, tinggal di SAVE.

Cara Memeberikan Effectnya :

Kalian hanya perlu menambahkan Code di bawah ke dalam Code Gambar Kalian.

<div class="hovergallery">URL Gambar Kalian</div>

Sebagai Contoh :

<div class="hovergallery">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7KPOA_1ZntD3Mf28Qjvc_ZDA2LvALt_gIBzunffDNV6kGo2MxAdBUvfrfjZiLs-zZp8-3vyTmLKbkSCjj-JACmf-9BGb-pKWY7xfbNLqHhqauILHTFy4D-ThoJDZl6XkFIOqu96XoPZom/s1600/Fb-IB-JmK-%25E2%2584%25A24.png</div>

NB :
- Kalo ada pertanyaan silahkan tuliskan pertanyaan Kalian di Kotak Komentar.

Semoga Berhasil...!!!