jQuery Mobile的下拉菜單中不會工作

Question

我已經作出了自己的下拉菜單中的頭一個jQuery移動頁：

<div data-role="header">     
<ul id="menu"> 
    <li><a href="#" data-role="button" data-icon="gear" data-rel="dialog">Menu</a> 
     <ul> 
      <li><a href="">Forgot to accept</a></li> 
      <li><a href="">Remove me from group</a></li> 
     </ul> 
    </li> 
</ul> 
<h1><?php echo $group_data['name']; ?></h1> 
... 

現在的問題是，降菜單CSS設置到位置：絕對和父li被設置爲正常的相對位置。現在的問題是，li不會出現在頂部，而是出現在data-role =「content」的div下。所以我的問題是我如何強制子菜單出現在所有其他div /圖層上（你知道他們稱之爲）？

我的菜單CSS：

#menu { 
    list-style: none; 
    padding: 0; 
    margin: 3px 0 0 5px; /* To make the menu button appear propper in the header */ 
} 

#menu li { 
    float: left; 
    position: relative; 
} 

#menu ul { 
    position: absolute; 
    display: none; 
    list-style: none; 
    color: #949494; 
    padding: 0; 
    margin: 3px 0 0 0; 
} 
#menu ul li{ 
    line-height: 50%; 
    float: none; 
} 
#menu ul a{ 
    color: #0291ff; 
    text-decoration: none; 
    font-size: 12px; 
    line-height: 150%; 
} 
#menu ul a:Hover{ 
    color: #000; 
} 

Answer 1

需要，即使你使用position: absolute設置的位置。

#menu ul { 
    position: absolute; 
    top: 0; 
    left: 0; 
    ... 
}