選擇框中的Scollbar沒有出現

我試圖製作一個下拉式滾動條。但事情並沒有解決。選擇框中的Scollbar沒有出現

因此，這裏的樣機：

<div class="form-group"> 

    <div id="fixedHeightDropDownContainer"> 
     <label class="control-label">@Resources.IntrusionGroup</label> 
     <select name="intGroup1" id="intGroup1" class="form-control" tabindex="10" data-bind="options: $root.intGroups, optionsText: 'Name', optionsValue: 'Id',optionsCaption: '--Select--',value:$data.IntGroupName"></select> 
    </div> 
    <a href="#" class="ispicon ispicon_plus" data-toggle="modal" data-target="#addSchedule" data-bind="click:$parent.addGroup" title="Create New">Create New</a> 

</div>

現在我試着在CSS：

div#fixedHeightDropDownContainer { 
    height: 100px !important; 
    width:auto !important; 
    overflow-y:auto !important; 
    background-color:red; 
}

但沒有奏效。我將樣式應用於div，但保留了下拉選項。

然後我嘗試：

#intrusionGroup1{ 
    height: 100px !important; 
    width:auto !important; 
    overflow-y:auto !important; 
    background-color:red; 
}

但也搞砸了UI。現在選擇選項本身具有高度，而不是選項菜單。

怎樣纔可以解決嗎？

謝謝。

來源

2016-09-29 StrugglingCoder

不可能擴大下拉。你必須做一些multiselect插件或爲它編寫jQuery代碼。 –

看看這篇文章http://stackoverflow.com/questions/24119643/html-select-tag-show-verticle-scroll-with-10-option –

如果您正在尋找可滾動下拉菜單和選擇框，您可以使用引導：有一個名爲「可滾動菜單」的類。使用它，你會得到滾動菜單爲您的下拉供參考： http://www.bootply.com/86116

來源

2016-09-29 11:01:09

'select-box'和'dropdown-菜單「，正確閱讀問題 –

是的，但引導程序的」可滾動菜單「適用於選擇框和下拉框，如果您知道引導程序 –

您必須在答案中提供一個示例。 –

爲了設置選擇框滾動您必須設置最大高度和overflow屬性。請試試這個。

select#intGroup1 { 
    max-height: 100px; 
    overflow: scroll !important; 
}

我認爲這將解決您的問題。

來源

2016-09-29 11:09:31 Nitheesh

你需要使用尺寸屬性

<select size="5"> 
    <option value="1">Apple</option> 
    <option value="2">Banana</option> 
    <option value="3">Mango</option> 
    <option value="4">Grapes</option> 
    <option value="5">Olives</option> 
    <option value="6">Jalapeno</option> 
    <option value="7">Potato</option> 
    <option value="8">Tomato</option> 
    <option value="9">Garlic</option> 
    </select>

而且here工作示例

來源

2016-09-29 11:12:05

選擇框中的Scollbar沒有出現

回答

相關問題