Gimana, sih cara membuat gambar pada postingan blog berputar?

sobat pernah melihat kursor yang sedang menunjukkan loading? kursor tesebut pasti berputar - putar, kan? nah, hal ini tidak hanya terjadi pada kursor saja, tapi juga pada gambar di postingan blog. maksud dari sini adalah jika kita menyentuh gambar tersebut dengan pointer mouse kita, maka gambar akan otomatis berputar.

Gimana sob, tertarik? lanjutkan membacanya sampai ke bawah, ya.

Ok, gak usah memperpanjang pembukaan, langsung saja.... Cekidot...

1. Login ke Blogger.com

2. pilih template > edit template

3. cari kode ]]></b:skin> untuk memudahkan pencarian, tekan CTRL + F

4. copas kode CSS berikut tepat di atas kode ]]></b:skin>:

#gambar {  
 float: left;  
 margin: 10px;  
 overflow: hidden;  
 position: relative;  
  -webkit-transition-duration: 0.8s;  
   -moz-transition-duration: 0.8s;  
   -o-transition-duration: 0.8s;  
   transition-duration: 0.8s;  
   -webkit-transition-property: -webkit-transform;  
   -moz-transition-property: -moz-transform;  
   -o-transition-property: -o-transform;  
   transition-property: transform;  
   overflow:hidden;  
 }  
 #gambar:hover {  
  -webkit-transform:rotate(360deg);  
   -moz-transform:rotate(360deg);  
   -o-transform:rotate(360deg);  
 }  

5. kemudian pilih simpan template
6. sekarang sobat pilih buat entri baru > HTML
7. copas kode berikut:

<div id="gambar">  
 <img src="url Gambar" />  
 </div>  

8. pilih publikasikan
9. sekarang sobat letakkan kursor di depan gambar dan WOW.....

begini, nih hasilnya....

semoga tips n/ trick kali ini berguna... :D