1 |
/* |
2 |
dark rgb(102,102,102) |
3 |
medium rgb(152,153,153) |
4 |
gray: rgb(204,204,204) |
5 |
bright: white; |
6 |
*/ |
7 |
|
8 |
.dynamic-slider-control { |
9 |
position: relative; |
10 |
background-color: transparent; |
11 |
-moz-user-focus: normal; |
12 |
-moz-user-select: none; |
13 |
cursor: default; |
14 |
} |
15 |
|
16 |
.horizontal { |
17 |
width: 200px; |
18 |
height: 27px; |
19 |
} |
20 |
|
21 |
.vertical { |
22 |
width: 29px; |
23 |
height: 200px; |
24 |
} |
25 |
|
26 |
.dynamic-slider-control input { |
27 |
display: none; |
28 |
} |
29 |
|
30 |
.dynamic-slider-control .handle { |
31 |
position: absolute; |
32 |
font-size: 1px; |
33 |
overflow: hidden; |
34 |
-moz-user-select: none; |
35 |
cursor: default; |
36 |
} |
37 |
|
38 |
.dynamic-slider-control.horizontal .handle { |
39 |
width: 15px; |
40 |
height: 16px; |
41 |
background-image: url("handle.horizontal.png"); |
42 |
} |
43 |
|
44 |
.dynamic-slider-control.horizontal .handle div {} |
45 |
.dynamic-slider-control.horizontal .handle.hover {} |
46 |
|
47 |
.dynamic-slider-control.vertical .handle { |
48 |
width: 16px; |
49 |
height: 15px; |
50 |
background-image: url("handle.vertical.png"); |
51 |
} |
52 |
|
53 |
.dynamic-slider-control.vertical .handle.hover {} |
54 |
|
55 |
.dynamic-slider-control .line { |
56 |
position: absolute; |
57 |
font-size: 0.01mm; |
58 |
overflow: hidden; |
59 |
border: 1px solid; |
60 |
border-color: rgb(102,102,102) white |
61 |
white rgb(102,102,102); |
62 |
|
63 |
behavior: url("include/boxsizing.htc"); /* ie path bug */ |
64 |
box-sizing: content-box; |
65 |
-moz-box-sizing: content-box; |
66 |
} |
67 |
.dynamic-slider-control.vertical .line { |
68 |
width: 4px; |
69 |
} |
70 |
|
71 |
.dynamic-slider-control.horizontal .line { |
72 |
height: 4px; |
73 |
} |
74 |
|
75 |
.dynamic-slider-control .line div { |
76 |
width: 2px; |
77 |
height: 2px; |
78 |
|
79 |
border: 1px solid; |
80 |
border-color: rgb(152,153,153) rgb(102,102,102) |
81 |
rgb(102,102,102) rgb(152,153,153); |
82 |
} |