merhaba
Açıkcası bu titreme olayının .net ile pek bir alakası yok. IE 6 ve aşağı versiyonlarında
CSS içinden tanımlanan resim dosyalarında bunu yapıyor. Kısa bir örnek ile nasıl çözeceğini açıklamaya çalışacam.
Kod:
<ul id="navigation">
<li class="navItem1"><a href="index.aspx">Ana Sayfa</a></li>
<li class="navItem2"><a href="hakkimizda.aspx">Hakkımızda</a></li>
</ul>
Yukarıda şekilde bir menümüz olduğunu varsayalım. Görüldüğü bu menü normalde textlerden oluşuyor. Ama biz bu menüyü
CSS dosyası içinden resimlerle süsleyeceğiz.
Kod:
ul#navigation,
ul#navigation li { margin:0; padding:0}
ul#navigation li {list-style-type:none; float:left; text-indent:-9999px}
ul#navigation li a {
background-repeat:none;
display:block;
height:20px;
text-decoration:none;
} //Tüm linklerin genel alacağı değerleri burada atıyoruz.
Eğer biz direk olarak linke arka planı verirsek
Kod:
ul#navigation li.navItem1 a {
background-image:url(/images/anasayfa_normal.gif); width:100px
}
ul#navigation li.navItem1 a:hover {
background-image:url(/images/anasayfa_hover.gif);
}
titreme problemi ile karşılaşırız.
//Linklerdeki titremeyi önlemek için linkin üzerine değilde linki içine alan li ye resmin ilk hali olanarka planı veriyoruz.
Kod:
ul#navigation li.navItem1 {
background-image:url(/images/anasayfa_normal.gif);
}
ul#navigation li.navItem1 a {
width:100px
} // Resim alanınn genişliğini vermeyi unutmuyoruz önemli!
//Bu kısımda ise link üzerine gelince açılacak olan resmin ikinci yani hover halini veriyoruz.
Kod:
ul#navigation li.navItem1 a:hover {
background-image:url(/images/anasayfa_hover.gif);
}
ve diğer linkleride bu şekilde tanımladığımızda artık IE 6.0 ve altındada problemsiz olarak çalıştığını görebileceksin. Kolay gelsin