Cara membuat Efek Pada Gambar Di Blog

Sudah lama tidak posting soal tips trik, akhirnya saya putusakkan untuk membuat trik sederhana untuk membuat gambar berefek redup terang atau terang redup jika di sorot dengan mouse nmanya mouse over. Disini ada 2 cara manual dan 1 cara otomatis untuk gambar di blog Anda.

Untuk cara pertama gambar redup menjadi terang:

Sebagai contohnya dulu :

Kode HTMLnya :

<img src="URL gambar" style="opacity:0.4;filter:alpha(opacity=40)"
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" />

*Ganti URL Gambar dengan URL gambar Anda.

Cara kedua dai gambar terang menjadi redup :
Sebagai contohnya :

Kode HTMLnya :

<img src="URL gambar" border="1" style="opacity:1;filter:alpha(opacity=100)"
onmouseover="this.style.opacity=0.4;this.filters.alpha.opacity=40"
onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100"/>

*Ganti URL Gambar dengan URL gambar Anda.

Cara terakhir yaitu membuat semua gambar di postingan Anda secara otomatis mempunyai efek mouse over yaitu menggunakkan kode CSS berikut :
Letakkan kodenya sebelum kode ]]></b:skin>

.post img{opacity:1;filter:alpha(opacity=1); this.style.opacity=6}

========================================================== 

.post img:hover{opacity:.5;filter:alpha(opacity=100); this.style.opacity=1}

Silahkkan Anda ingin mencoba yang mana, semua sama saja.Semoga Berhasil