Resimli Anlatım eklenmiştir...
Blogunuza eklediğiniz resimlere biraz hareket getirmek ister miziniz: Artık resimlerinize donukluk efekti verebiliceksiniz. Bu efekt sayesinde mousela resmin üzerine geldiğimizde resimler canlanacak. Aşağıdaki örneğimizi test edebilirsiniz. -http://tambirblog.blogspot.com/
Önce Html'ye aşağıdaki kodları ]]></b:skin>'den önce ekliyoruz...
a.linkopacity img {filter:alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5;} a.linkopacity:hover img {filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0;}
Yazımızın içinde efekti uygulayacağımız resimlere ise aşağıdaki kodu uygulayacağız:
<a class="linkopacity" href="Resmin gideceği adres" title="Resmin açıklama"><img alt="" style="border: 1px solid black;" src="Resim Urlsi" /></a>
Resim Url'si yerine de yüklemiş olduğumuz resmin adresini giriyoruz. Bu kadar
Artık resimleriniz mouse hareketimizle hayat buluyor...
Yazıyı İmle
6 yorum
bunu denedim olmadı tek tek değil de genel olarak bloğun taamında olan kod işe yaramadı sanki ya da ben beceremedim....
2 Nisan 2009 12:11
tamamında olan kodu önce ekliyoruz... Bu kod saydamlık sağlayacaktır.
Daha sonra hangi resme bu efekti vermek istiyorsak
2. kırmızı kodu yazımızın html kısmına yapıştırıyoruz. Daha sonra da resmimizin linkini veriyoruz.
2 Nisan 2009 12:39
Resimler eklenmiştir...
2 Nisan 2009 12:50
çok başarılı. bloğumdaki son yazıma uyguladım ve süper oldu.. kodlar çalışıyor.
tine tam not tam bir blog !!
tşk:)
8 Nisan 2009 10:45
@BodrumSibel
Evt güzel durmuş.. Sayende kodların çalıştığını da anlamış olduk...
8 Nisan 2009 15:27
değiştirerek kullandım :) linkopacity yerine seffaf kelimesini kullandım. pek akılda kalıcı değil çünkü. Tşkr ederim.
7 Aralık 2010 12:08
Yorum Gönder