membuat efek photo semu/blur pada gambar

Pada saat saya Pergi kuliah, ada teman yang menanyakan : `Ki bagaimana cara membuat efek semu seperti gambar yang ada di sudut pojok blog kamu,??` saya jawab: Wah... susah banget itu .?’ hee..hee..
Gak Cuma bercanda…!!! Sepertinya memang menarik juga untuk di pasang. Efek photo yang di maksud adalah photo (gambar) akan terlihat samar ketika pertama kali dilihat, namun apabila photo atau gambar tersebut di sorot oleh mouse komputer teman2 maka photo atau gambar tersebut menjadi terlihat jelas,, masih Bingung juga… Ya dah di sorot dahulu gambar yang ada dipojok kiri blog ini,, sekarang udah jelas kan…???
Langkah A
1. Silahkan login ke blog dengan ID anda. 
2. Klik Tata letak. 
3. Klik tab Edit HTML. 
4. Klik pada tulisan Download Template Lengkap di bagian sebelah atas monitor. Silahkan di Backup dulu templatenya (sangat penting). 
5. Silahkan cari kode berikut : ]]></b:skin> 
6. Copy paste kode berikut di atas kode ]]></b:skin>

.linkopacity img {
filter:alpha(opacity=30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
.linkopacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
border:0;
}
.linkopacityxtra:hover img {
filter:alpha(opacity=1.1);
-moz-opacity: 1.1;
opacity: 1.1;
border:0;
} 

Klik tombol Simpan Template.
Langkah A selesai



Langkah B

Setiap Teman2 ingin memasang photo atau gambar dengan efek semu/blur, pastikan sisipkan kode seperti ini :
<a href="url tujuan" class="linkopacity"><img src="url sumber gambar"></a>

kalo gambar teman2 tidak ingin nge-link ke mana-mana, maka cukup gantikan saja alamat url tujuan dengan dengan kode #nogo