m-pack.select.css
3.26 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
.pack_jselect {
/*position: absolute;*/
display: inline-block;
background: #fff;
font-size: 12px;
vertical-align: middle;
min-width: 100px;
*display: inline;
*zoom: 1;
position: relative;
}
.poppage .pack_jselect {
position: relative;
}
/* 选中项 */
.pack_jselect div {
overflow: hidden;
white-space: nowrap;
cursor:pointer;
height: 30px;
background: #fff;
position: relative;
border: 1px solid #ddd;
text-align: left;
}
.pack_jselect div:hover{
/*border-color: #666;
box-shadow: 0 0 4px #ccc;*/
}
.pack_jselect div span {
width: 100%;
display: block;
}
.pack_jselect.model_disabled div {
cursor: default;
}
.pack_jselect div span {
display: inline-block;
line-height: 30px;
padding: 0 10px;
overflow: hidden;
}
/* 箭头样式 */
.pack_jselect div em {
background:white;
display: inline-block;
width: 25px;
height: 30px;
padding: 0;
position: absolute;
right: 0px;
}
.pack_jselect div em em {
display: inline-block;
height: 0;
width: 0;
padding: 0;
margin: 0;
left: 5px;
top: 12px;
border: 5px solid #666;
border-top-color: #666;
border-left-color: transparent;
border-right-color: transparent;
border-bottom-color: transparent;
}
/* 模拟的下拉框样式 */
.pack_jselect .s-pack_jselect-list{
overflow: visible;
position: absolute;
/*position: relative;*/
background: #fff;
border: 1px solid #ddd;
margin: -32px 0 0 0;
left: 0;
}
.pack_jselect li {
cursor:pointer;
min-height: 18px;
line-height: 18px;
padding: 6px 10px;
list-style: none;
text-align: left;
float: none !important;
clear: both;
margin: 0 !important;
}
.pack_jselect .s-select-bar{
padding: 0;
border-bottom: 1px #ccc solid;
}
.pack_jselect .s-select-bar input{
width: 100%;
height: 30px;
line-height: 30px;
border: 0;
background: url('../../images/yy-rnso.png') right center no-repeat;
}
.pack_jselect-selected,
.pack_jselect li:hover {
background: #23ac38;
color: #fff;
}
.pack_jselect-selected{
color: #333 !important;
}
.pack_jselect-selected, .pack_jselect-selected:hover {
background: #eee;
}
.pack_jselect-selected:hover {
background: #eee !important;
}
.pack_jselect li.disabled_click.pack_jselect-selected,
.pack_jselect li.disabled_click,
.pack_jselect li.disabled_click:hover {
cursor: text;
background: none;
color: #ddd !important;
}
/* 该样式加在原始 option 上，由js 自动附加到 模型上 */
li.select_please {
background: #fff;
color: #ccc;
border-bottom: 1px solid #ccc;
margin: 0 8px;
padding: 5px 10px;
}
li.select_please:hover {
background: none!important;
color: #666;
}
/* 如果选择的是含有原始class 的 option 则同样将该样式附加到已经选择的选项框的样式上 */
div.select_please {
color: #999;
}
.pack_jselect-selected.select_please, li.select_please:hover {
color: #ccc !important;
}
/* 原始select 不可用 */
.disabled,
.model_disabled div {
background: #eee;
color: #bbbbbb;
}
.model_disabled div em.pack_jselect_arrow, .model_disabled div em.pack_jselect_arrow em {
background: #eee;
}
.model_disabled, .model_disabled .select_please, .model_disabled .pack_jselect div {
cursor: default;
}
.disabled {
/*border: 1px solid #999;*/
}
/* 色块通用class */
.s-color {
display: inline-block;
width: 15px;
height: 15px;
vertical-align: middle;
margin-right: 5px;
border: 1px solid #999;
}