css - 在 div 上设置菜单（z-index）

问题描述

我有示例页面来描述我的问题：https
://www.suale.it/Shelter/app/app/index.html 如果您尝试打开菜单，并尝试在“列表”和“新广告”之间单击，您将点击下拉搜索菜单

如您所见，我已将菜单的 z-index 设置为 1，将搜索 DIV 设置为 0，但我没有解决问题，我的结果是：

$("div[data-role='panel']").panel().enhanceWithin();

  <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>



<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>



  <body>

    <!--   <input type=button onclick="clickButton()" value="prova">-->

    <div role="main" class="ui-content">


  <div  id="menuPanel"   class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-icon-bars ui-btn-icon-left ui-btn-b" >
            <h4>Menu</h4>
            <ul data-role="listview">
                <li><a href="#" style="color: #FFFFFF" >List</a></li>
                <li><a href="#" style="color: #FFFFFF" >New Ads</a></li>
                <li><a href="#" style="color: #FFFFFF" >Register</a></li>
                <li><a href="#" style="color: #FFFFFF" >Login</a></li>
               <li><a href="#" style="color: #FFFFFF" >Your Ads</a></li>
                 <li><a href="#"  onclick='Website2APK.rateUs();'>Rate us</a></li>               
            </ul>
            <p></p>
            <img src="img/head2.jpg" />
        </div> 
        
        
        
        
        
               <div id="divFilter"  >
                <table>
                    <tr>
                        <td><b>Category</b></td>
                        <td><b>Type</b></td>
                        <td><b>Distance Km</b></td>
                    </tr>
                    <tr>
                        <td>
                            <select id="cbbSearchCategory" onchange="ScaricadatiEavvia();"></select></td><!---->
                        <td>
                            <select id="cbbSearchType" onchange="ScaricadatiEavvia();"></select></td><!---->
                         <!-- <td>
                          <select id="cbbSearchRace" onchange="ScaricadatiEavvia();">
                                <option value=""></option>
                            </select>
                        </td>-->
                        <td>
                            <select id="cbbSearchKM" class="form-control" onchange="ScaricadatiEavvia();">
                              <!-- <option value=""></option>  <option value=""></option>
                                <option value="20">20</option>-->
                                <option value="5">5</option>
                                <option value="10">10</option>                               
                                <option value="20">20</option>
                                <option value="40">40</option>
                                <option value="100">100</option>
                                <option value="500">500</option>
                                <option value="" selected>2000</option>
                            </select>
                        </td>
                          <!-- <td>
                                <input type="button" id="btn2"  onclick="ScaricadatiEavvia();" value="Filter"/>-->
                    </tr>
                </table>
            </div>
        </div>      
              </body>

标签： css

css - 在 div 上设置菜单（z-index）

问题描述

解决方案

推荐阅读