当前位置: 代码迷 >> Web前端 >> 自定义表单select元素式样
  详细解决方案

自定义表单select元素式样

热度:109   发布时间:2012-10-08 19:54:56.0
自定义表单select元素样式

做项目要用到自定义样式的select插件,自己就用jQuery写了一个。

说明如下:

1、插件的样式完全有css控制,可以自定义select插件中任何一个部分的样式。

2、完全模拟select元素的交互习惯,支持select元素的js功能,例如:change事件。如果选中一个条目,此插件就会改变原select的value值,并且自动触发change事件。

3、支持键盘的操作。完全模仿原生的select的键盘习惯,支持上下键翻动,回车键选中当前条目,包括滚动条的自动适应。

?

插件预览

?

?

插件可配置项:

1、css样式位于css中,可自行配置。

2、js配置项:

??????????????????? top: 0,
??? ??? ??? ??? ??? left: 0,
??? ??? ??? ??? ??? liActive: "active",
??? ??? ??? ??? ??? maxItems: 40

top和left是插件距离原select位置,一般不用配置。

liActive是鼠标经过条目时的样式。

maxItems是显示的最大条目,多于此条目时出现滚动条。

?

文件打包提供下载。

?

1 楼 yuanjianhang 2011-07-13  
现在还是有小的bug――在下拉条出现后的滚动条的位置定位上。
不过已经在攻克中……
  相关解决方案