Tarih: 2008-05-26, 12:58:40 Mesaj konusu: CSS İle Yapılmış Açıklamalı Sol Menü
örneği resimde gördüğünüz gibi
menülerin üzerine gelince sağa doğru açılan açıklama penceresi geliyor
tüm kod açıklamaları mevcut istediğiniz gibi değişiklik yapabilirsiniz.
kodları block-cssmenu.php olarak kaydedip blockların altına atın
örnekte verdiğim butonları buradan indirebilirsiniz.
butonları nereye atıyorsanız kodlarda gerekli değişikliği yapmayı unutmayınız.
Kod:
<?
$content.='<style type="text/css">
* Menu Div CerveVe bicimi */
#menu {
float:left;
width:152px;
}
/* Menu içindeki Liste EtiketLerini Bicimlendirme */
#menu li, #menu ul {
padding:0px 0px 0px 0px;
margin:0px 0px 0px 0px;
list-style:none;
text-align:left;
}
/* Menu Liste içinDeki LinKleri Biçimlendirme */
#menu li a {
padding:8px 0px 0px 20px;
font-family:"Comic Sans MS";
font-size:13px;
text-decoration:none;
color:#FFFFFF;
background:url(buttona2.gif) no-repeat;
width:152px;
height:32px;
display:block;
}
/* Menu Liste içinDeki LinKleri Fare İmleci Üzerinde İken Biçimlendirme */
#menu li a:hover {
background:url(buttonahover2.gif) no-repeat;
font-size: 80%; /* IE5.x/Win duzeltmek icin Desteklemeyen İE Serisini için Çözüm*/
}
/* Menu Linkelere Eklenmiş Span Etiketi İçerğini İlk Sayfada Gizleme */
#menu li a span {
display:none;
}
/* Menu Linkelere Eklenmiş Span Etiketi İçerğini Fare Hareketi İle Gösterme */
#menu li a:hover span {
display:block;
position:absolute;
top:auto;
left:160px;
background:#000066;
font-family:"Comic Sans MS";
border:solid #0033FF 1px;
width:200px;
}
</style>
<div id="menu" style="width: 150px; height: 284px">
<ul>
<li><a href="#">Anasayfa<span>Sitenin Bütün İçerik Linkleri Bu sayfada</span></a></li>
<li><a href="#">Netopsiyon Forum<span>Bu Forumlarda Yok Yok</span></a></li>
<li><a href="#">Müzik<span>Müzik Bölümümüz Her Türlü Full Albüm</span></a></li>
<li><a href="#">Video<span>Video İçeriği</span></a></li>
</ul></div>
Bu forumda yeni başlıklar açamazsınız Bu forumdaki başlıklara cevap veremezsiniz Bu forumdaki mesajlarınızı değiştiremezsiniz Bu forumdaki mesajlarınızı silemezsiniz Bu forumdaki anketlerde oy kullanamazsınız
Arama
Rütbeliler
Profil
Giriş
