Mengubah Kursor ketika Diarahkan ke Gambar

Cara Mengubah Kursor memang menarik, terutama ketika diarahkan ke gambar. Kursor yang defaultnya berupa pointer (gambar tangan), akan berubah ketika diarahkan langsung ke area gambar, benar-benar menarik. Caranya sangat mudah,

Cara Mengubah Kursor ketika Diarahkan ke Gambar

Cara Mengubah Kursor memang menarik, terutama ketika diarahkan ke gambar. Kursor yang defaultnya berupa pointer (gambar tangan), akan berubah ketika diarahkan langsung ke area gambar, benar-benar menarik. Caranya sangat mudah, tidak perlu edit css. Penasaran?..

Hasilnya nanti seperti ini
(Arahkan kursor anda ke gambar di bawah)

Bagaimana? Terlihat kan perubahannya. Jadi, ketika anda mengarahkan kursor anda ke kotak hitam tersebut, otomatis kursor berubah menjadi gambar monyet YoYo. Yuk belajar cara membuatnya bersama..Jangan lupa siapkan teh dan camilan.

Ikuti langkah pembuatan mengubah kursor ketika diarahkan ke gambar :

1. Log in ke blog anda
   
2. Posting >> New post
   
3. Upload gambar melalui add image (Seperti biasa)
   
4. Setelah gambar terupload, berikutnya click tab "Edit Html"
   
5. Secara default gambar yang terupload mempunyai kode seperti ini :
   
   
   <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHDASpNBp1clkqEETzI2_85XJjJbflHNOyTmEo77pCo9UR0vjztq2RZuo18lHfzWO-MsS2kUCrhghj1VITrfkzwbj8-_p2-QMNczXd82s9Z1B8VBMxxlUFgdZKuB2HEhmCzf26c1SDrKiH/s1600-h/kotak+kursor.jpg"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 189px; height: 92px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHDASpNBp1clkqEETzI2_85XJjJbflHNOyTmEo77pCo9UR0vjztq2RZuo18lHfzWO-MsS2kUCrhghj1VITrfkzwbj8-_p2-QMNczXd82s9Z1B8VBMxxlUFgdZKuB2HEhmCzf26c1SDrKiH/s320/kotak+kursor.jpg" alt="" id="BLOGGER_PHOTO_ID_5437226557469385330" border="0" /></a>
   Akan menghasilkan gambar dengan kursor pointer (gambar tangan) :
   
   
   
   Ganti kode di atas yang saya beri warna merah menjadi kode seperti di bawah ini.
   
   
   <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHDASpNBp1clkqEETzI2_85XJjJbflHNOyTmEo77pCo9UR0vjztq2RZuo18lHfzWO-MsS2kUCrhghj1VITrfkzwbj8-_p2-QMNczXd82s9Z1B8VBMxxlUFgdZKuB2HEhmCzf26c1SDrKiH/s1600-h/kotak+kursor.jpg"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: url(http://img42.imageshack.us/img42/290/yoyoemoticon.gif), wait; width: 189px; height: 92px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHDASpNBp1clkqEETzI2_85XJjJbflHNOyTmEo77pCo9UR0vjztq2RZuo18lHfzWO-MsS2kUCrhghj1VITrfkzwbj8-_p2-QMNczXd82s9Z1B8VBMxxlUFgdZKuB2HEhmCzf26c1SDrKiH/s320/kotak+kursor.jpg" alt="" id="BLOGGER_PHOTO_ID_5437226557469385330" border="0" /></a>
   Akan menghasilkan gambar dengan kursor YoYo (gambar YoYo) :
   
   

   

!! Yang harus diubah/diedit :

cursor:url(http://img42.imageshack.us/img42/290/yoyoemoticon.gif) . Ganti teks yang berwarna biru dengan url gambar anda, jangan gambar yang terlalu besar dan jangan gambar wanita.

Mudeng kan? Nah, jadi caranya hanya tinggal mengganti kode "Cursor". Kalau sudah mengerti, teh dan camilannya udah habis kan? Langsung aja praktekkan. Selamat mencoba.