Image Menajadi Samar Ketika Cursor Di Atasnya

Langkah Pertama

Caranya adalah sebagai berikut :

1. Login ke Akun Blogger anda masing-masing.
2. Klik Design or Rancangan, kemudian pilih Edit HTML
3. Centang (Expand Widget Template)
4. Untuk keamanan lebih baik kita (Download Template Lengkap)
5. Gunakan (Ctrl+F) or (Alt+E+F) untuk memudahkan pencarian
6. Cari kode ini ]]></b:skin> pada template anda.
7. 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;}

8. Save

Langkah Kedua

Siapkan alamat sebuah image yang telah dilengkapi dengan target link (URL yang dituju), misalnya :

<a href="http://www.3xploration.co.cc/"><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://www.3xploration.co.cc/"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.

♂ Good Luck ♀

Semua ini adalah apa yang pernah aku cobain sendiri . . dan aku dapat/mengerti dari teman2 blogger lainnya karena aku hanya seorang blogger pemula yang ingin mengetahui lebih banyak hal lagi . . . . Thank's

Related Post