Cara Membuat Efek Gambar Di Postingan Blog Berputar/ Rotasi dan Membesar/Zoom

Yang akan saya share kali ini adalah Cara Membuat Efek Gambar Di Postingan Blog Berputar/ Rotasi dan Membesar/Zoom. Jadi ketika sahabat indoking mengarahkan kursor ke gambar di postingan, maka gambar akan berputar/rotasi 360 derajat dan membesar/zoom. Dan efek gambar berputar/rotasi dan membesar/zoom ini sendiri hanya akan bekerja pada gambar di bagian postingan saja. Sementara gambar lainnya diluar postingan tidak akan berputar, seperti gambar di postingan blog. Baiklah langsung saja simak turitorialnya di bawah ini:

1. Masuk ke Blogger.com
2. Klik Template => Edit HTML
3. Cari kode ]]></b:skin>
4. Copy kode CSS dibawah ini, lalu Paste diatas kode ]]></b:skin>
 

/*Image Rotate*/
.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.5) rotate(360deg) translate(0px);-moz-transform:scale(1.5) rotate(360deg) translate(0px);-webkit-transform:scale(1.5) rotate(360deg) translate(0px);-o-transition:all 1.5s ease;-moz-transition:all 1.5s ease;-webkit-transition:all 1.5s ease}

 
Catatan :
Semakin besar nilai dari kode berwarna Hijau, maka kecepatan berputas semakin lama.
Semakin besar nilai dari kode berwarna Biru, maka gambar akan semakin besar.
5. Klik Simpan Template

6. Selesai 


Demikianlah yang bisa saya share tentang Cara Membuat Efek Gambar Di Postingan Blog Berputar/ Rotasi dan Membesar/Zoom. Selamat mencoba !