Cara Membuat Gambar Berputar Dan Membesar Saat Disorot Mouse

Memang banyak sekali cara untuk mempercantik tampilan dari sebuah halaman blog, Mempercantik tampilan blog juga ternyata sangat berguna untuk menarik perhatian bagi pengunjung, sehingga pengunjung akan betah berlama lama berada di blog. Seperti yang akan kami share pada kesempatan kali ini yaitu "Cara Membuat Gambar Berputar Dan Membesar Saat Disorot Mouse". Pada umumnya gambar yang diupload ke dalam postingan merupakan gambar dengan tampilan standar yaitu tanpa ada sesuatu yang menarik selain dari isi Gambar itu sendiri. Nah supaya tampilan gambar lebih menarik sekarang kami akan memberikan sedikit sentuhan pada Gambar yang akan menghasilkan Gambar Berputar Dan Membesar Saat Disorot Oleh Mouse.

Cara Membuat Gambar Berputar Dan Membesar Saat Disorot Mouse - Sebuah Gambar akan Berputar Dan Membesar Pada Saat Pointer Mouse berada pada area Gambar tersebut. sehingga akan menimbulkan efek yang cukup menarik pada gambar tersebut. Untuk lebih jelasnya sahabat bisa melihat contoh yang telah sundaboy buat dibawah ini :

Nah sekarang apabila sahabat tertarik untuk Membuat Gambar Berputar Dan Membesar Saat Disorot Mouse, silahkan lakukan langkah langkah 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>

6. Setelah itu Simpan template

Selanjutnya untuk bisa menampilkan Gambar Berputar Dan Membesar Saat Disorot Mouse, sahabat copy kode dibawah ini pada halaman posting maupun sidebar blog.

<div id="sundaboy">

<a href="http://downloadfree-script.blogspot.com/"><img src="KODE GAMBAR" /></a></div>

Keterangan :

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

Nah gimana, mudah bukan Cara Membuat Gambar Berputar Dan Membesar Saat Disorot Mouse, apabila sahabat mengerti dengan kode HTML atau CSS sahabat bisa menambahkan sentuhan lain pada kode diatas.

Itulah yang dapat kami share tentang Cara Membuat Gambar Berputar Dan Membesar Saat Disorot Mouse, mudah mudahan dapat bermanfaat untuk kita semua, kurang lebihnya mohon untuk dimaklumi. selamat berkreasi.