Cara Jadikan Image Dalam Entri Blog Jadi Kabur a.k.a Image Opacity Effect

 Tudiaaa..Lama dah tuan tanah tak buat tutorial pasal blog ni hangpa tau dak. Kali ni nak buat tutorial supaya jadikan image/gambar dalam entri blog korang ada kesan kabur bila mouse diletakkan pada gambar tu. Nak tengok contoh boleh letak mouse kat gambar bawah ni:

Cute tak gambo kucing ni?Macam ikan buntal pun ado ye dak? Hehe

Ok la.Kalau korang rasa blog korang pun nak bagi jadi macam tu, ikut la langkah-langkah kat bawah ni k.

Mula-mula masuk ke bahagian Dashboard > Design > Add A Gadget > Pilih HTML/Javascript

Lepas tu copy coding kat bawah ni masuk kat dalam HTML/Javascript tu

 

<style>
/* ----- Image opacity effect 1 ----- */
.post a img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0;
}

.post a:hover img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: 0.5;
}
</style>

Kemudian Save.

Senang je...Jadi tak????Kalau jadi ce cite^_^


Jom test drive Volkswagen dan menang Ipad 2. Klik la tengok