Trik Memperbesar Gambar Ketika Disentuh Kusor

      Pasti sudah sering bukan, sobat blogger sekalian  menemukan kejadian seperti judul diatas di website atau blog - blog yang sempat sobat hampiri memiliki gambar bereffect zoom in dan zoom out ketika didekatkan dengna mouse, tentunya membuat sobat bertanya - tanya bagaimana cara membuatnya, bukan ?


Nah, biar tidak semakin kepo, berikut ini adalah langkah - langkahnya yang dapat sobat lakukan :

1. Masuk ke Blogger Sobat.

2. Pilih Template -> Klik Edit HTML ( Sebelah Sesuaikan)

3. Cari kode ]]></b:skin>  dan letakkan script dibawah ini dibagian atasnya.

.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); }

*Untuk memperbesar atau memperkecil gambarnya anti dapat diatur di transform: svale dibagian didalam kurung

4. Pilih Simpan Template, guna menyimpan semua perubahan.

    Dan demikian trik yang dapat saya berikan di kempatan kali ini, semoga bermanfaat bagi sobat sekalian.