Membuat Zoom & Berputar Gambar di Blog

Kali ini kita akan berbagi tentang cara membuat gambar dalam posting blog berputar dan membesar saat di sentuh oleh kursor. Apabila anda sekalian berminat untuk mencoba silakan ikuti langkah berikut ini:

• Silahkan login dulu di akun blog anda
• Pilih rancangan / desing dan klik edit HTML dan lanjutkan
• Centang "Expand Template Widget" untuk menghindari apabila terjadi kesalahan
• Cari kode </head>
• Setelah ketemu copy paste code di bawah ini tepat di atas kode </head>

<style>#sansuve img{-moz-transition:all .8s ease-in-out;-ms-transition:all .8s ease-in-out;-o-transition:all .8s ease-in-out;-webkit-transition:all .8s ease-in-out;transition:all .8s ease-in-out;} #sansuve img:hover{ -o-transform: scale(1.5) rotate(360deg); -moz-transform: scale(1.5) rotate(360deg); -webkit-transform: scale(1.5) rotate(360deg);}</style>

• klik save / simpan template.

Langkah selanjutnya untuk penenpatan gambar dalam postingan.

Tambahkan kode  <div id="sansuve"> sebelum url gambar dan jangan lupa di tutup dengan kode </div> contoh seperti di bawah ini:

<div id="sansuve"> <a href="http://tukangmulungit.blogspot.com/"> <img src="http://3.bp.blogspot.com/-fCj7THbaiRg /UP6J_u4K6YI/s320/Untitled-1.jpg" /></a> </div>