一个滚动条,用于三个选项或选择区域

时间:2012-05-24 11:23:58

标签: javascript html scroll

我想实现三个<select>...</select>区域或<option>...</option>区域,由一个滚动框控制,应该看起来像

|-------|  |-------|  |-------| /\ 
|  aas  |  |  aas2 |  |  sdj3 |  | 
|  asd  |  |  asd2 |  | werh3 |  |
|  qwd  |  |  qwd2 |  | qwe3  |  | 
|-------|  |-------|  |-------| \/ 

是否可以创建单独的滚动条,如何实现它?

我应该使用jquery和javascript还是其他什么?

6 个答案:

答案 0 :(得分:1)

当然是的:
 看看这个:http://jsfiddle.net/freealone/eEhky/3/

答案 1 :(得分:0)

你需要的只是一点点css。 只需将三个元素放在带有类的div中,例如.main并添加此css:

.main {
 max-height: 100px; //or whatever you want
 overflow-y: scroll;
}

查看css overflow属性

我认为这是您所需要的最简单的解决方案:http://jsfiddle.net/g3UWu/1/

答案 2 :(得分:0)

你不能只创建一个具有指定高度和CSS溢出的容器div:scroll;并将这三个区域(作为div)放在容器内?

答案 3 :(得分:0)

我认为你可以做到。您想要多个选择有一个问题吗?我举了那个例子。这是你想要的吗?当您选择项目时,它会变为红色并选中一个复选框。这是纯粹的js

http://jsfiddle.net/boralp/qQD7U/7/

答案 4 :(得分:0)

我找到了一个很好的方法来滚动表格,因为必须将表包含在包装器中,并且对于包装器应用以下样式:

.scroll_wrapper{
  float:left;
  overflow:auto;
  height:266px;    <-- some custom height
  width:100%;
}

这适用于IE和Mozilla浏览器。

所以我只创建包含3列的包装表,而不是使用div标签创建表....

但无论如何,建议确实很有用。

答案 5 :(得分:-1)

在这里尝试15个最好的jquery滚动条

http://slodive.com/web-development/jquery-scroll/