CARA MEMBUAT GAMBAR MEMBESAR BILA TERSENTUH KURSOR

Membuat Gambar Membesar Saat disentuh Cursor

Untuk memperbaiki performance blog kita ada baiknya kita mencoba trik berikut ini yaitu bilamana gambar dilewati oleh kursor mouse maka gambar akan membesar. Trik ini disebut dengan Image Zoom Effects atau Hover Zoom Smooth Effects. Apapun istilahnya fitur yang satu
ini banyak di senangi para blogger terutama blog yang banyak menggunakan foto maupun gambar.
Postingan ini saya buat untuk melengkapi Tutorial di blog ini, buat sobat yang ingin memasangnya silakan Anda ikuti tutorial dibawah ini.



Cara Membuat Gambar Membesar Saat disentuh Cursor :

1. Login ke blogger.
2. Pilih Template & klik Edit HTML.
3. Cari kode ]]></b:skin>; , gunakan fungsi Find dengan menekan tombol CTRL+F pada keyboard.
4. letakkan kode berikut tepat di atas kode ]]></b:skin>

.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: 0px 0px; -moz-border-radius: 0px / 0px; -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6); }

1. • Simpan Template

Selamat Mencoba ......