jquery下拉不工作？

我正在寫一個新的wordpress主題。我添加了我的CSS html和js代碼示例。問題是什麼？下拉菜單不工作。任何人都可以幫我嗎？jquery下拉不工作？

的CSS部分是：

.HeaderContent #MainMenuBg {float:left; margin-top:10px; width:880px; height:30px; overflow:hidden;} 
.HeaderContent #MainMenu {margin:0px; padding:0px;} 
.HeaderContent #MainMenu li {display:block; float:left; list-style-type:none; margin-right:10px; margin-top:7px; padding-right:10px;} 
.HeaderContent #MainMenu li a {font-family:Tahoma; font-weight:bold; color:#ffffff; font-size:11px; text-decoration:none;} 
.HeaderContent #MainMenu li a:hover {text-decoration:underline; color:#FFE212;} 
.HeaderContent #MainMenu li ul { margin: 0; padding: 0; position: absolute; visibility: hidden; border-top: 1px solid white} 
.HeaderContent #MainMenu li ul li { float: none; display: inline} 
.HeaderContent #MainMenu li ul li a { width: auto; background: #9F1B1B} 
.HeaderContent #MainMenu li ul li a:hover { background: #7F1616}

HTML部分是：

<div id="MainMenuBg"> 
      <ul id="MainMenu"> 
       <li><a href="">Ana sayfa</a></li> 
       <li><a href="">Güncel</a> 
        <ul> 
         <li><a href="#">Son haber 1</a></li> 
         <li><a href="#">Son haber 2</a></li> 
         <li><a href="#">Son haber 3</a></li> 
         <li><a href="#">Son haber 4</a></li> 
         <li><a href="#">Son haber 5</a></li> 
        </ul> 
       </li> 
       <li><a href="">Siyaset</a></li> 
       <li><a href="">Ekonomi</a></li> 
       <li><a href="">Politika</a></li> 
       <li><a href="">Kadın</a></li> 
       <li><a href="">Magazin</a></li> 
       <li><a href="">Otomobil</a></li> 
      </ul> 
     </div>

JS部分是：

$(document).ready(function() { 

    $('#MainMenu li').hover(
     function() { 
      //altmenuler 
      $('ul', this).slideDown(100); 

     }, 
     function() { 
      //altmenugizle 
      $('ul', this).slideUp(100);   
     } 
    ); 


});

什麼高度重視和我做它的工作原理？謝謝。

來源

2012-01-29 Fatih Toprak

你有沒有在網頁上的錯誤？ – 2012-01-29 20:40:33

該代碼實際上工作正常，但你無法看到可能是因爲CSS。菜單中的文本顏色爲white，隱藏了菜單的可見性。改正belwo兩個css規則，它應該可以正常工作。

變化

.HeaderContent #MainMenu li ul { 
    margin: 0; 
    padding: 0; 
    position: absolute; 
    visibility: hidden; 
    border-top: 1px solid white 
}

到

.HeaderContent #MainMenu li ul { 
    margin: 0; 
    padding: 0; 
    position: absolute; 
    display: none;/*Changed to display:none becase slideDown/Up do not manipulate visiblity*/ 
    border-top: 1px solid white 
}

變化（這不會是問題，如果你的頁面的背景不是白色）

.HeaderContent #MainMenu li a { 
    font-family:Tahoma; 
    font-weight:bold; 
    color:#ffffff; 
    font-size:11px; 
    text-decoration:none; 
}

到

.HeaderContent #MainMenu li a { 
    font-family:Tahoma; 
    font-weight:bold; 
    color:#0000ff;/*Changed to some other color than white */ 
    font-size:11px; 
    text-decoration:none; 
}

來源

2012-01-29 20:45:38 ShankarSangoli

你對我找到了解決方案。這是關於頂級div的CSS ..頂部div溢出：隱藏的元素;）現在我得到了它的感謝 – 2012-02-01 22:49:05

Selam Fatih，「Güncel」中只有一個DropdownMenü，對不對？

看到你的代碼示例如下：http://jsfiddle.net/7PGPE/1/ - 工作正常。究竟是什麼問題？

來源

2012-01-29 20:37:34 ahmet2106

jquery下拉不工作？

回答

相關問題