Cara Membuat Gambar Berputar dan Membesar di Sorot Kursor Mouse

Cara Membuat Gambar Berputar dan Membesar di Sorot Kursor yang tujuannya dalam postingan ketika jika menyertakan sebuah atau beberapa buah gambar akan tampil unik dan antik serta menarik. Gambarannya ketika Kursor mengenai gambar tersebut maka gambar akan membesar otomatis tanpa di klik dan menariknya ketika terjadi pembesaran di sertai dengan berputar, gimana sobat asikkan.....
contohnya seperti di bawah ini dan coba sobat arahkan kursor mous di atas gamar tersebut :

Gimana asikkhan......

Okey jika sobat tertarik untuk mencobanya silahkan simak dan lakukan langkah-langkahnya berikut ini:

1. Login terlebih dahulu ke Blogger

2. Selanjutnya Pilih Rancangan

3. Pilih Edit HTML

4. Cari kode </head>

5. Copy kode dibawah ini dan letakan tepat diatas kode </head>

<style>#sundaboy 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;} #sundaboy img:hover{ -o-transform: scale(1.5) rotate(360deg); -moz-transform: scale(1.5) rotate(360deg); -webkit-transform: scale(1.5) rotate(360deg);}</style>

Selanjutnya untuk bisa menampilkan Gambar Berputar dan Membesar di Sorot Kursor, sahabat copy kode dibawah ini pada halaman posting maupun sidebar blog.


<div id="sundaboy">
<a href="http://gratisfulltain.blogspot.com/"><img src="KODE GAMBAR" /></a></div>


Keterangan :

•    http://gratisfulltain.blogspot.com/ Ganti dengan Url yang dituju pada saat gambar diklick
•    KODE GAMBAR Ganti dengan Url Gambar milik sahabat

sumber gratisfulltain.blogspot.com