Bunu Nasıl Yaparım ?

Merhabalar
Birçok kişisel blog'da gördüğüm aşağıdaki resimdeki gibi değişen şeffaflık görünümünü nasıl yapabilirim?



Örnek Blog: www.osmankus.com


.

baglı olduğu divi ve css kodlarını alarak yapabilirsin..

Valla Kardeş Yapamadım. Bi Yardımcı Olur musun?

<img src="resim.gif" 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"></img>

Bu şekilde kullanabilirsin yada stil dosyasına eklersin..

İlk önce temanın style.css dosyasını aç ve şu kodları ekle:

#sosyal {
width: 265px;
height: 36px;
float:center;
}
#sosyal li{
float: right;
list-style: none;
margin-right: 12px;
}

.mrdmn { margin:0px auto;width:32px;height:32px; background-color:#ebe9e1;}
.mrdmn a{ margin:0px auto;width:32px;height:32px;opacity:0.4;filter:alpha(opacity=40); background-color:#ebe9e1;}
.mrdmn a:hover{margin:0px auto;width:32px;height:32px;opacity:1;filter:alpha(opacity=100); background-color:#ebe9e1;}

Daha sonra ise bu sosyal linkleri nerede görüntülemek istiyorsan oraya şu kodları ekle:

<center><div id="sosyal">
<li><div class="mrdmn"><a href="Buraya Deviantart linki gelecek"><img src="http://www.osmankus.com/blog/wp-content/themes/freshnews/images/deviantart.png" alt="Deviantart" title="Deviantart" /></a></div></li>
<li><div class="mrdmn"><a href="Buraya Flickr linki gelecek"><img src="http://www.osmankus.com/blog/wp-content/themes/freshnews/images/flickr.png" alt="Flickr" title="Flickr" /></a></div></li>
<li><div class="mrdmn"><a href="Buraya FrindFeed linki gelecek"><img src="http://www.osmankus.com/blog/wp-content/themes/freshnews/images/friendfeed.png" alt="FrindFeed" title="FrindFeed" /></a></div></li>
<li><div class="mrdmn"><a href="Buraya Twitter linki gelecek"><img src="http://www.osmankus.com/blog/wp-content/themes/freshnews/images/twitter.png" alt="Twitter" title="Twitter" /></a></div></li>
<li><div class="mrdmn"><a href="Buraya Facebook linki gelecek"><img src="http://www.osmankus.com/blog/wp-content/themes/freshnews/images/facebook.png" alt="Facebook" title="Facebook" /></a></div></li>
<li><div class="mrdmn"><a href="Buraya RSS linki gelecek"><img src="http://www.osmankus.com/blog/wp-content/themes/freshnews/images/rss.png" alt="RSS" title="RSS"/></a></div></li>
</div></center>

"Buraya ... linki gelecek" şeklindeki yazıları değiştir.

Hepsi bu kadar.

Çok Teşekkürler