如何隱藏頂部菜單後的下拉菜單？

當用戶首先點擊一個下拉菜單，然後盤旋頂層菜單（這是一個絕對位置和z-index高的div）時，打開的下拉菜單仍顯示在頂層菜單的頂部。我希望它隱藏在菜單下。

如何隱藏打開的下拉菜單？（不使用JavaScript）

編輯：不可能的，看到How to select options overlapping an absolute positioned DIV?

我做了應該說明問題小提琴：https://jsfiddle.net/9m84dv6h/2/

下面的代碼（當頂部菜單打開）：

HTML：

<div id="topmenu"></div> 
<br> 
<div class="dropdown"> 
    <select> 
     <option>1</option> 
     <option>1</option> 
     <option>1</option> 
    </select> 
</div>

CSS

#topmenu { 
    position:absolute; 
    min-height:80px; 
    width: 15px; 
    background: red; 
    z-index: 50; 
} 

select { 
    z-index: 10; 
    position: relative; 
} 

.dropdown { 
    z-index: 10; 
    position: relative; 
}

來源

2016-07-01 Gustaf Holmqvist

不可能，請參閱：http://stackoverflow.com/questions/8188353/css-select-options-overlapping-absolute-positioned-div – Praveen

好。我，我正在尋找一個類似的問題，但沒有找到它。我會將我的問題標記爲重複。謝謝！ –

https://github.com/supunsameera/jQuery.dropdown –

我認爲這是瀏覽器控制的項目，將始終出現在頂部。嘗試使用像selec2一些插件或選擇自定義下拉，您可以完全控制

來源

2016-07-01 10:34:13 Justinas

https://github.com/supunsameera/jQuery.dropdown –

如何隱藏頂部菜單後的下拉菜單？

回答

相關問題