如何顯示其他div的下拉菜單？

所以我有一張桌子，我通過更改css中的表格可滾動來水平滾動它。如何顯示其他div的下拉菜單？

但是，下拉菜單開始在表格末尾以可滾動方式切斷。所以下拉菜單在技術上是可見的，但您必須將光標放在下拉菜單附近，並嘗試向下滾動以查看下拉菜單的其餘部分。我試圖讓隱藏的overflow-y禁用垂直滾動，但沒有讓下拉菜單超過其他div。當然，Z-指標太..

所以之前的代碼片斷它看起來像這樣（你可以選擇按鈕會被截斷）：

enter image description here

 $('.table-scrollable').css({'display' : 'inline-block', 'width' : '100%', 'overflow-x' : 'auto'}); 
     $('.dropdown-toggle').css({'z-index' : 9999}); 
     $('.dropdown-menu').css({'z-index' : 9999}); 
     $('.li').css({'z-index' : 9999});

和代碼後，它看起來像這樣：

enter image description here

我怎麼能有表可滾動的水平，仍然既能使下拉菜單可見，因爲它用於？所以下拉菜單會覆蓋頁碼？

來源

2017-03-03 tonybrown

請包括了一個獨立的示例說明問題。 – Christoph

在這一行添加'position：absolute' $（'。dropdown-menu'）。css（{'position'：absolute}）;' – neophyte

@neophyte這是一種模糊的假設，因爲我們一無所知關於代碼結構。如果它之前沒有定位過，這可能會打破下拉菜單，如果有的話，它不會改變任何東西， – Christoph

設置你的下拉列表fixed位置，替換代碼：

$('.dropdown-menu').css({'z-index' : 9999});

到：

$('.dropdown-menu').css({'position' : 'fixed', 'z-index' : 9999});

，但還會有其他的問題，固定的位置...

或代替固定的位置讓你的table-scrollable有固定的高度，所以它總是可以讓下拉以適合我T的高度，而不會hidding它的變化：

$('.table-scrollable').css({'display' : 'inline-block', 'width' : '100%', 'overflow-x' : 'auto'});

到：

$('.table-scrollable').css({'display' : 'inline-block', 'width' : '100%', 'min-height': '200px', 'overflow-x' : 'auto'});

（我猜你的問題做出overflow，當你有表無數據）

來源

2017-03-03 14:47:42 Ultrazz008

感謝您的幫助。但是，通過這種方式，下拉框以同樣的方式在同一個div中溢出，因此您必須在div中向下滾動才能看到下拉列表，而不是出現在下面的div上。它用來顯示其他div的下拉菜單，現在如果你不在相同的div上滾動，它會隱藏。 – tonybrown

然後嘗試固定位置，我寫的第一個方法。 – Ultrazz008

我試着將它改爲固定和絕對，但仍然一樣。我仍然需要在表格的div內向下滾動以查看下拉菜單。我看到你用min-height：200做了什麼，當只有一行時，它使表格變得更大一點，它可以解決有一行時的問題。然而，桌子的高度是不確定的，因爲可能有不同數量的行，所以最小高度可以輕易地小於實際，所以如果有意義的話，它將不起作用。 – tonybrown

如何顯示其他div的下拉菜單？

回答

相關問題