如何在html选择框中添加滚动条？有没有任何
javascript库模拟这种行为？
或者有没有重新设计,界面我有2个选择框,项目可以通过>>移动到右边的选择框. &安培; << Filezilla,norton指挥官,总指挥官的类型的接口,可以左右移动项目…(问题是如何重新设计,以查看固定宽度选择框中的溢出字)
从this forum post,指向另一个example,示例代码将覆盖使用div显示其他文本,但它要求用户将鼠标悬停在选项上.不是我正在寻找的解决方案,虽然我会暂时使用它.
<html>
<body>
<table>
<tr><td>
<select size="4" id="mySelect" style="width:65px;color:#f98ad3;">
<option value="1" selected>option 1 The Long Option</option>
<option value="2">option 2</option>
<option value="3">option 3</option>
<option value="4">option 4</option>
<option value="5">option 5 Another Longer than the Long Option ;)</option>
<option value="6">option 6</option>
</select>
</td>
<td>
<input type="button" value=">>"/><br>
<input type="button" value="<<"/>
</td>
<td>
<select size="4" id="mySelect" style="width:65px;color:#f98ad3;">
<option value="1" selected>option 1 The Long Option</option>
<option value="2">option 2</option>
<option value="3">option 3</option>
<option value="4">option 4</option>
<option value="5">option 5 Another Longer than the Long Option ;)</option>
<option value="6">option 6</option>
</select>
</td>
</tr>
</table>
</body>
</html>
解决方法
本机不支持HTML Select中的水平滚动条.但是,这里有一种创建水平滚动条的外观的方法：
首先创建一个css类
<style type="text/css">
.scrollable{
overflow: auto;
width: 70px; /* adjust this width depending to amount of text to display */
height: 80px; /* adjust height depending on number of options to display */
border: 1px silver solid;
}
.scrollable select{
border: none;
}
</style>
2.将DIV包含在DIV中 – 也显式地将大小设置为选项数.
<div class="scrollable">
<select size="6" multiple="multiple">
<option value="1" selected>option 1 The Long Option</option>
<option value="2">option 2</option>
<option value="3">option 3</option>
<option value="4">option 4</option>
<option value="5">option 5 Another Longer than the Long Option ;)</option>
<option value="6">option 6</option>
</select>
</div>
