[teknik]
(6) 

css sorusu

uckac #328002
bir sınıftaki herhangi bir tagin hover'ını kullanarak başka bir sınıfın başka bir tagini kontrol edemiyor muyuz? yani;

ul#menu li a.tagbir:hover ul#submenu{
display: inline;
}

gibi bir kontrol söz konusu olabilir mi? anlayacağınız gibi menu-alt menu kontrolü yapmaya çalışıyorum.

 

eğer içindeyse yapabilirsin sanırım

edit: şimdi denedim tipini belirtince oluyor
<html>
<head>
<style type="text/css">
.lol
{
background-color:red;
}
a:hover div.lol
{
width:200px;
background-color:yellow;
}
</style>
</head>

<body>
<a href="www.w3schools.com">asd<div class="lol">eheh</div></a>

</body>
</html>

hatta boşluk bırakıp .lol şeklinde yapınca da oluyormuş
hatta
stackoverflow.com

yuto

Sorunu tam anlayamadım. .tagbir class'ına hover olduğunda #submenu display:inline olsun mu istiyorsun. Css prosedürel bir yaklaşımdır bir durumun içerisindeyken başka bir durumu tetikleyemezsin. Javascript desteği gerektirir. Tabi surun bu şekildeyse... İstersen örneğini mesaj at görerek yardımcı olmaya çalışayım. Ayrıca display:inline ie7'de çalışmıyor. Tabi crossbrowser'ın senin için önemini bilemiyorum. Söyleyeyim dedim.

urubitinga

evt böyle yapabilirsin. yalnız direk a içine div i koyarsın aklı şaşar tarayıcının nereye link vereceği konusunda. yapın şu şekilde olmalı. tarayıcı uyumluluğu için de jquery hover kullanabilirsin.

<ul>
<li>
<a href="">menu</a>
<div>
altmenu burada
</div>
</li>
</ul>

sadece css kullanıcam dersen cssplay.co.uk da drodown menu örnekleri var ama yeni başlayanlara karışık gelebilir.

emrag

yok,yeni başlamadım olaya, sadece şu css'in işe yaramazlığına sinir oluyorum. jquery ile veya sadece div'lerle yapabiliyorum olayı ama benim mantığımca bunun anlattığım şekilde css ile yapılabilmesi lazım fakat olmuyor işte. teyit ettirmek için yazdım soruyu, teşekkür.

uckac

direk css ile de yapılabiliyor. cssplay.co.uk adresindeki amca bu işin piri. onun örneklerine bakabilirsin.

emrag

<html>
<head>
<style type="text/css">
#A{width:120px; height:30px; background:green; text-align:center; padding:0; margin:0;}
#A:hover{background:red;}
#A:hover #Alt{display:block;}
#Alt{position:absolute; top:30px; width:120px; background:silver; text-align:center; display:none;}
.AltAlt .Alt {background:silver; width:120px;}
.AltAlt:hover {background:gray;}
.AltAlt .Alt {display:none;}
.AltAlt:hover .Alt {display:inline; position:absolute; left:120px;}
</style>
</head>

<body>
<div id="A">
Osman
<div id="Alt">
<div class="AltAlt">Mahmut</div><div class="AltAlt">Cafer<div class="Alt"><div class="AltAlt">Mustafa</div></div></div>
</div>
</div>
</body>
</html>

yuto
1

mobil görünümden çık