CSS Opacity (Saydamlık) ve Hover Kodu
Css opacity kodu ile bir tabloyu resmi veya bir menü elemanını Css hover ve opacity özellikleri ile saydamlaştırabiliriz veya üzerine gelince değiştirebiliriz. Hemen aşağıda örnek bir kod vermek istiyorum. İmg yazan yerdeki etiketi değiştirerek başka nesnelerinize de saydamlık verebilirsiniz. Daha detaylı anlatımı Ozicab Design Css Anlatımları #3 konusunda anlatacağım.
img
{
opacity:0.4;
filter:alpha(opacity=40); /* For IE8 and earlier */
}
Üzerine Gelince Solan Resim Css Hover Opacity Kodu Ön izlemesi
Kod:
<a href='http://ocabbaroglu.blogspot.com/' target='_self'><img alt='' body='' border='0' onmouseout='this.style.opacity=1;this.filters.alpha.opacity=100' onmouseover='this.style.opacity=0.4;this.filters.alpha.opacity=0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbtQgy7AOzXWKkdeq3ilhcprOYMWYTNRyvBs-fjQynBiUttXSqlM-U3rojZvGiiGvlBD_gZg-HAE779Zch25xF21omOfQNhDB0nnhBdKoF2b48eV-j8nXLtFiLZzvPvmaQ66W7KiBcVHQ/s1600/haziranlogoocab.png' style='opacity: 1; '/></a>
Üzerine Gelince Renklenen Resim Css Hover Opacity Kodu Ön izlemesiKod:
<a href="http://ocabbaroglu.blogspot.com" target="_self"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbtQgy7AOzXWKkdeq3ilhcprOYMWYTNRyvBs-fjQynBiUttXSqlM-U3rojZvGiiGvlBD_gZg-HAE779Zch25xF21omOfQNhDB0nnhBdKoF2b48eV-j8nXLtFiLZzvPvmaQ66W7KiBcVHQ/s1600/haziranlogoocab.png" 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" body="" alt="" /></a>
CSS Opacity (Saydamlık) ve Hover Kodu
Reviewed by Oğuzhan Cabbaroğlu
on
7/05/2012
Rating:
Oğuzhan şunun gibi nasıl yapabiliriz ;
YanıtlaSilhttp://muujdatsayar.blogspot.com/
Paylaşımların resimleri ve logo üzerine gelince biraz değişme oluyor.
.post img, table.tr-caption-container {
YanıtlaSilpadding:4px;
border:1px solid #cccccc;
opacity:1.0;
}
img:hover
{
opacity:0.8;
}
kodlarını sitene ekle ama değişebilr temaya göre etiketlere bi bak
Ozi nedeyim artık :) hairkasın
YanıtlaSilTamamdır kardeşim oldu sağolasın.
YanıtlaSilrica ederim genşler :)
YanıtlaSilkardeşim videoozideki gibi katogori nasıl yapılır simdiden Allah razı olsun...
YanıtlaSilÜstüne gelince bide Küçük bir açıklama çıkıyo onu nasıl yapıcaz ?
YanıtlaSilTeşekürler Oguzhan
YanıtlaSilrica ederim :)
YanıtlaSil