如何在html中的导航栏上放置下拉框

时间:2013-10-01 06:09:35

标签: javascript html css drop-down-menu cordova

我添加了导航栏并需要在其上放置下拉框,但是下拉框隐藏在导航栏下,这是我的下拉框代码

<div class="wrapper">
<div class="button">
<div id="ddmenu">
<ul>                
    <li>SHARE
        <div>
            <div class="column">
                <a id="sendFacebook" onclick="share(3)" href="#">Email</a>
                <a id="sendMMS" onclick="share1(3)" href="#">MMS</a>

            </div>
        </div>
    </li>      
  </ul>    
</div>
</div>

按钮类

.wrapper {
text-align: center;
 }

.button {
position: absolute;
top: 10%;
left: 20px;
}

navigationBar类

.navigationBar {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 45px;
background-color: #333;
background-repeat: repeat-x;
color: #FFF;
text-align: center;
line-height: 44px;
font-size: 14pt;
-webkit-text-shadow: 0px -1px 0px #000;
text-shadow: 0px -1px 0px #000;
 }

我尝试的是,将.navigationBar的位置更改为相对位置,但这会使导航栏显示在底部。

1 个答案:

答案 0 :(得分:0)

最简单的方法是为按钮类添加z-index的CSS值。

z-index: 100;