Arama butonu
Bu konudaki kullanıcılar: 1 misafir, 1 mobil kullanıcı
8
Cevap
783
Tıklama
0
Öne Çıkarma
açılır menü sorunsalı
O
10 yıl
Teğmen
Konu Sahibi

Merhaba,

Bir site üzerinde çalışıyorum fakat menü kısmında alt menüyü açılır şekilde yapmaya çalışmaktayım. Sliderın altında kaldığı için menü görünmüyor.

Desteklerinizi rica ederim.

html kod :

<ul class="menu"> 
<li class="home-page current"><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=108461018&url=index.html" data-href="index.html"><span></span></a></li>
<li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=108461018&url=about.html" data-href="about.html">Hakkımızda</a></li>
<li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=108461018&url=services.html" data-href="services.html">Hizmetlerimiz</a>
<ul class="alt">
<li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=108461018&url=#" data-href="#">a</a></li>
<li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=108461018&url=#" data-href="#">b</a></li>
<li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=108461018&url=#" data-href="#">c</a></li>
</ul></li>
<li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=108461018&url=projects.html" data-href="projects.html">Projects</a></li>
<li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=108461018&url=clients.html" data-href="clients.html">Clients</a></li>
<li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=108461018&url=contacts.html" data-href="contacts.html">İletişim</a></li>
</ul>


ücerinde uğraşılmış css kod :

ul.menu {margin:0 1px 0 0;  border-right:#7acad7 1px solid; display:inline-block; float:left; z-index: 9999;  position:relative;} 
ul.menu li {float:left; line-height:17px; margin:0 0 0 0; background:url(../images/transp.png) 0 0 repeat; border-right:#53b2c3 1px solid; border-left:#82ceda 1px solid}
ul.menu li a {font-size:13px; line-height:17px; color:#fff; font-weight:bold; display:block; padding:23px 28px 24px 28px}

ul.alt {margin:0 1px 0 0; border-right:#7acad7 1px solid; display:inline-block; float:left z-index: 9999; position:relative;}
ul.alt li {float:left; line-height:17px; margin:0 0 0 0; background:url(../images/transp.png) 0 0 repeat; border-right:#53b2c3 1px solid; border-left:#82ceda 1px solid}
ul.alt li a {font-size:13px; line-height:17px; color:#fff; font-weight:bold; display:block; padding:23px 28px 24px 28px}

ul.menu li ul.alt{
position:absolute; /* al listeyi diğer nesneleri etkilemeyecek şekilde konumlandırıyoruz*/
display:none;/*alt menümüzü ekrandan kaldırıyoruz.*/
/*mouse menü üzerine gelince görünür olacak*/
}
ul.menu li ul.alt li{
float:none; /*alt liste elemanlarının yanyana olmasını istemiyoruz. Alt alta yer alacaklar*/
}
ul.menu li.home-page {display:inline-block; background:url(../images/transp.png) 0 0 repeat; border-radius:8px 0 0 8px; border:none !important}
ul.menu li:hover , ul.menu li.current {background:url(../images/current.jpg) 0 0 repeat-x #000000; border-right:#000000 1px solid; border-left:#000000 1px solid}
ul.menu li.home-page a {padding:21px 22px 24px 23px !important}
ul.menu li.home-page span {background:url(../images/home-page-img.png) 0 0 no-repeat; width:19px; height:19px; display:block}
ul.menu li:hover > ul.alt{
display:block;
}
ul.alt li.home-page {display:inline-block; background:url(../images/transp.png) 0 0 repeat; border-radius:8px 0 0 8px; border:none !important}
ul.alt li:hover , ul.alt li.current {background:url(../images/current.jpg) 0 0 repeat-x #000000; border-right:#000000 1px solid; border-left:#000000 1px solid}
ul.alt li.home-page a {padding:21px 22px 24px 23px !important}
ul.alt li.home-page span {background:url(../images/home-page-img.png) 0 0 no-repeat; width:19px; height:19px; display:block}


Bu css kodunun orjinalinde sadece ul.menu vardı fakat ben alt menü ekleyeceğim için ul.alt ekledim

Orjinalini paylaşmamı isterseniz eğer ;

ul.menu {margin:0 1px 0 0;  border-right:#7acad7 1px solid; display:inline-block; float:left} 
ul.menu li {float:left; line-height:17px; margin:0 0 0 0; background:url(../images/transp.png) 0 0 repeat; border-right:#53b2c3 1px solid; border-left:#82ceda 1px solid}
ul.menu li a {font-size:13px; line-height:17px; color:#fff; font-weight:bold; display:block; padding:23px 28px 24px 28px}
ul.menu li.home-page {display:inline-block; background:url(../images/transp.png) 0 0 repeat; border-radius:8px 0 0 8px; border:none !important}
ul.menu li:hover , ul.menu li.current {background:url(../images/current.jpg) 0 0 repeat-x #000000; border-right:#000000 1px solid; border-left:#000000 1px solid}
ul.menu li.home-page a {padding:21px 22px 24px 23px !important}
ul.menu li.home-page span {background:url(../images/home-page-img.png) 0 0 no-repeat; width:19px; height:19px; display:block}


Teşekkürler.

DH forumlarında vakit geçirmekten keyif alıyor gibisin ancak giriş yapmadığını görüyoruz.

Üye olduğunda özel mesaj gönderebilir, beğendiğin konuları favorilerine ekleyip takibe alabilir ve daha önce gezdiğin konulara hızlıca erişebilirsin.

Üye Ol Şimdi Değil