Membuat Efek Zoom Gambar Blog

Yang dimaksud dengan efek zoom adalah efek pembesaran gambar yang ada pada konten blog, ketika cursor mouse di dekatkan pada gambar tersebut.

Dengan memsang efek zoom, maka tampilan blog kita akan lebih atraktif, dan dinamis.

Walaupun terkadang ketika rasio pembesaran tidak seimbang misalnya perubahan dari gambar asli dengan hasil zoom terlalu besar akan sedikit menimbulkan rasa kurang nyaman. Terlebih jika terdapat jumlah gambar dengan jumlah banyak dalam postingan blog dan disimpan berdampingan.

Jadi sebaiknya ubah rasio perbesaran gambar dengan bijaksana yang penting dapat membuat konten blog kita tampak atraktif dan menarik.

Sobat netter….

Untuk anda yang mau memasang efek zoom pada gambar blog silahkan anda lihat pada pemaparan berikut ini.

Login ke akun blog kita > Template > Edit HTML

Untuk sekedar berjaga-jaga sebaiknya kita backup dulu template blog kita agar dapat kita kembalikan ke semula apabila proses editing HTML tidak berjalan dengan benar.

carilah kode ]]></b:skin>

dan kemudian tempelkan kode berikut ini tepat diatasnya

.post img, table.tr-caption-container {border:none;max-width:560px;height:auto;-o-transition: all 0.5s;-moz-transition: all 0.5s;-webkit-transition: all 0.5s;}
.post img:hover {-o-transition: all 0.3s;-moz-transition: all 0.3s;-webkit-transition: all 0.3s;-moz-transform: scale(1.5);-o-transform: scale(1.5);-webkit-transform: scale(1.5);-webkit-border-radius: 36px 12px;-moz-border-radius: 36px / 12px;-webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);}

Selanjutnya silahkan preview dulu hasil editing kita, jika ternyta sudah tidak ada error maka kita simpan perubahan.

catatan : untuk angka 1.5 yang bertuliskan tebal dan ( berwarna merah ) ubah menurut kehendak anda. itu adalah skala perbesaran gambar yang terjadi.

Selesai dan blog anda skarang sudah bisa menampilkan efek zoom pada gambar konten blognya.

Oke sobat…………. rupanya cukup sekian dulu yang bisa saya persembahkan pada kesempatan ini.