Üye Girişi
Bağlan Google+ ile Bağlan Facebook ile Bağlan
Yeni Kayıt
Tüm Forumlar
  • Tüm Forumlar
  • Web Tasarım - Programlama
  • Tasarım ve grafik
  • Web Tasarım ve Hazır Kodlar
  • Bu Konuda
Şimdi Ara

açılır menü sorunsalı

Sıcak Fırsatlarda Tıklananlar
Editörün Seçtiği Fırsatlar
Bu Konudaki Kullanıcılar:
2 Misafir - 2 Masaüstü
5 sn
9
Cevap
0
Favori
698
Tıklama
Daha Fazla
İstatistik
  • Konu İstatistikleri Yükleniyor
Konuya Özel
0 oy
Öne Çıkar
Cevapla
Sayfa: 1
Giriş
Mesaj
  • 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.







  • O-Zee AKA Contecau kullanıcısına yanıt
    Manşetin position değeri absoulute mi? Sorununun çözümü ya z-index ile yada position değerini değiştirmekle çözülür. "ul.menu li:hover" bu koda position:relative; bu değeri ver bakalım sonuç ne olacak.
  • Hocam şimdi iki adet ul.menu li:hover var.

    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}

    buna koydum bir şey olmadı fakat

    ul.menu li:hover > ul.alt{
    display:block;
    }

    bu kısma koyunca şöyle göründü;

    açılır menü sorunsalı



    < Bu mesaj bu kişi tarafından değiştirildi O-Zee AKA Contecau -- 26 Temmuz 2015; 16:47:39 >




  • O-Zee AKA Contecau kullanıcısına yanıt
    Şöyle yapalım o zaman.Üste çıkacak yani menünün divine bu değeri ver.
    position:absolute; z-index:2;
    Altta kalacak yani manşetin divine de şu değeri ver.
    position:absolute; z-index:1;
  • Hocam ilginiz için teşekkürler fakat kodda yerleştirebilirseniz daha sağlıklı olacak.

    Çünkü deneme yanılma yapıyorum fakat sonuca erişemedim ya kayma oluyor, ya da hiç alt alta çıkmıyor.

    div dediğiniz kısım sanırım şurası

    ul.menu {margin:0 1px 0 0; border-right:#7acad7 1px solid; display:inline-block; float:left; z-index:2; position:absolute;}

    ul.alt {margin:0 1px 0 0; border-right:#7acad7 1px solid; display:inline-block; float:left z-index:1; position:absolute;}

    fakat bunda da herhangi bir değişiklik olmuyor.
  • O-Zee AKA Contecau kullanıcısına yanıt
    Menü kodlarınızı sizin düzenlediğiniz css kodları ile birlikte denedim.Altına resim ekledim.Açılır menüde bir sorun var mı diye baktım fakat bir sorun görünmüyor.Bu yüzden hata manşet kodlarınız da diye düşünüyorum.
  • quote:

    Orijinalden alıntı: MOLİVER

    Menü kodlarınızı sizin düzenlediğiniz css kodları ile birlikte denedim.Altına resim ekledim.Açılır menüde bir sorun var mı diye baktım fakat bir sorun görünmüyor.Bu yüzden hata manşet kodlarınız da diye düşünüyorum.

    hocam manşet dediğiniz kısım neresi oraya yoğunlaşayım
  • O-Zee AKA Contecau kullanıcısına yanıt
    Slider demek yerine manşet demeyi tercih ediyorum.İkisi aynı anlama geliyor.
  • Teşekkürler hocam ilginiz için.
    • 
Sayfa: 1

Benzer içerikler

- x
Bildirim
mesajınız kopyalandı (ctrl+v) yapıştırmak istediğiniz yere yapıştırabilirsiniz.
Hizmet kalitesi için çerezleri kullanabiliriz. DH’ye girerek kullanım izni vermiş sayılırsınız.
Anladım Veri Politikamız