Image jadi samar ketika kursor diarahkan

IMAGE JADI SAMAR KETIKA KURSOR DIATASNYA

Image yang ditampilkan akan menjadi buram/samar ketka kursor berada diatasnya.

Demo : Lihat Disini

Silahkan anda simak langkah-langkahnya.

1. Langkah Pertama
• Masuk ke Blogger dengan ID anda.
• Pilih Rancangan.
• Pilih Edit HTML.
• Cari kode ini ]]></b:skin> pada template anda.
• Copy kode dibawah ini kemudian paste tepat diatas kode tadi.
  
  
  
  .linkopacity img {filter:alpha(opacity=100); -moz-opacity:1.0; opacity:1.0; border:0;}
  .linkopacity:hover img {filter:alpha(opacity=30); -moz-opacity:0.3; opacity:0.3;border:0;}
• Klik tombol Simpan Template
2. Langkah Kedua
• Siapkan alamat sebuah image yang telah dilengkapi dengan target link (URL yang dituju), misalnya :
  
  
  <a href="http://epg-studio.blogspot.com"><img src="http://i0006.photobucket.com/albums/0006/pbhomepage/Emo/th_2-1.jpg"></a>
• Jika image tersebut ingin disamarkan ketika kursor berada diatasnya, tambahkan kode class="linkopacity" pada alamat image diatas, misalnya :
  
  
  <a href="http://epg-studio.blogspot.com"class="linkopacity"><img src="http://i0006.photobucket.com/albums/0006/pbhomepage/Emo/th_2-1.jpg"></a>
• Jika image tidak memiliki target link, buatlah seperti contoh dibawah ini :
  
  
  
  <a href="#nogo" class="linkopacity"><img src="http://i0006.photobucket.com/albums/0006/pbhomepage/Emo/th_2-1.jpg"></a>
  
  
  
  Perhatikan huruf yang bercetak merah adalah yang harus anda tambahkan.
  
  
3. Selamat mencoba , semoga bermanfaat...!!!

Read more: http://epg-studio.blogspot.com/2009/07/image-jadi-samar-ketika-kursor.html#ixzz1ipktdR00