Cara Membuat Efek Zoom Gambar Saat Disorot Mouse Pada Blog

Assalamu'alaikum Wr Wb. Salam Sejahtera bagi kita semua, yah sobat hari ini saya akan share mengenai cara memperbesar foto/gambar pada blog. contohnya pada blog saya ini :

Coba Anda Sorotkan mouse anda ke gambar Synyster Gates,, apa yang terjadi??
nah tak usah bingung. saya akan beritahu anda :)

1. Login Ke akun blogger sobat
2. Masuk Ke Template lalu klik Edit HTML
3. Centang "Expand Template Widget" (tanpa tanda kutip) atau bisa tekan F3 agar lebih cepat
4. Cari kode ]]></b:skin> (Gunakan Ctrl + F untuk cara cepat)

lalu copy dan pastekan kode di bawah ini tepat di atas kode tadi.

.post img{-o-transition:all 1.5s ease;-moz-transition:all 1.5s ease;-webkit-transition:all 1.5s ease}.post img:hover{-o-transform:scale(1.2) rotate(360deg) translate(0px);-moz-transform:scale(1.2) rotate(360deg) translate(0px);-webkit-transform:scale(1.2) rotate(360deg) translate(0px);-o-transition:all 1.5s ease;-moz-transition:all 1.5s ease;-webkit-transition:all 1.5s ease}

Jika sudah klik pratinjau terlebih dahulu, kalau tidak error klik save/Simpan Template
sekian dari saya terimakasih :)

Posted in: Tutorial Blog