css - Chosen jquery 插件中的垂直滚动问题

Question

1. 转到链接 -> jsfiddle .
2. 单击垂直滚动条的向下箭头。将显示选项(选项 11 将突出显示，垂直滚动条将位于底部)
3. 不要点击垂直滚动条的向上箭头。 (不要使用鼠标滚轮滚动)

向上一级后滚动停止。选项 1 到 4 不可见。 (用鼠标向上拖动滚动条有效)

知道发生了什么吗？与用于添加垂直滚动的 css 有什么关系？

谢谢!

HTML

<select id="html-multi-chosen-select" multiple="multiple">
    <option selected='selected' value="Options 1">Options 1</option>
    <option selected='selected' value="Options 2">Options 2</option>
    <option selected='selected' value="Options 3">Options 3</option>
    <option selected='selected' value="Options 4">Options 4</option>
    <option selected='selected' value="Options 5">Options 5</option>
    <option selected='selected' value="Options 6">Options 6</option>
    <option selected='selected' value="Options 7">Options 7</option>
    <option selected='selected' value="Options 8">Options 8</option>
    <option selected='selected' value="Options 9">Options 9</option>
    <option selected='selected' value="Options 10">Options 10</option>
    <option value="Options 11">Options 11</option>
    <option value="Options 12">Options 12</option>
    <option value="Options 13">Options 13</option>
    <option value="Options 14">Options 14</option>
    <option value="Options 15">Options 15</option>
</select>

JS

$('#html-multi-chosen-select').chosen({ width: "210px" });

添加垂直滚动的CSS:

#html_multi_chosen_select_chosen ul.chosen-choices{
    max-height:80px;
    overflow: auto;
}

Answer 1

这对我有用

<style>
    #myChosenID_chosen .chosen-choices{
        max-height:80px;
        overflow: auto;
    }
</style>