CSS Opacity Kodu

Yine CSS paylaşımları ile devam ediyorum.Blogunuzun tasarımında kullanabileceğiniz çok hoş bir CSS kodu.

Bu Kod Ne İşe Yarar ?

Kodumuz mouse ile bir resmin üzerine gelindiğinde soluk halinden kendi rengine dönmesidir.Yani mouse'u resmin üzerine koyduğun zaman parlaklık katıyor.

Vereceğim kodlar IE içinde uyumludur.

<img src="resimadresi.jpg" 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" />

Opacity kodumuzun IE'de çalışması için ondalık bölümleri "opacity:0.4"  ile diğer gelişmiş tarayıcılarda çalışması için ise doğal sayılı bölümleri "opacity=40" değiştirmeniz gerekecek.Ondalık ve doğal sayılı bölümler birbiri ile aynı olmalıdır.

"resimadresi.jpg" bölümüne ekleyeceğiniz resmin linkini koyacaksınız.İsterseniz biraz CSS bilgisi ile bunu temanız da bulunan tüm resimlere ya da sadece yazılarınızda bulunan resimlere uygulayabilirsiniz.

DEMO: