rosa-build/doc/design/styles/cusel.css

170 lines
2.8 KiB
CSS
Raw Normal View History

@charset "utf-8";
/*
styles for select
*/
.cusel:focus { outline: none; }
.cusel,
.cuselFrameRight,
.jScrollPaneDrag,
.jScrollArrowUp,
.jScrollArrowDown {
background: url("../pics/selects-2.png") no-repeat;
}
.cusel {
height: 24px;
background-position: left top;
display: inline-block;
position: relative;
cursor: pointer;
font-size: 12px;
z-index: 1;
}
.cuselFrameRight {
position: absolute;
z-index: 2;
top: 0;
right: 0;
height: 100%;
width: 42px;
background-position: right top;
}
.cuselText {
height: 29px;
padding: 6px 0 0 10px;
cursor: pointer;
overflow: hidden;
position: relative;
z-index: 1;
font: 12px Tahoma, Arial;
position: absolute;
top: 0;
left: 0;
}
* html .cuselText {
height: 22px;
}
.cusel span {
display: block;
cursor: pointer;
white-space: nowrap;
padding: 2px 5px 2px 5px;
zoom: 1;
}
.cusel span:hover,
.cusel .cuselOptHover {
background: #dcecfa;
border-radius: 0px;
}
.cusel .cuselActive {
cursor: default;
}
/*
styles for focus and hover
*/
.cusel:hover,
.cusel:hover .cuselFrameRight,
.cusel:focus,
.cusel:focus .cuselFrameRight,
.cuselFocus,
.cuselFocus .cuselFrameRight {
background-image: url("../pics/selects-focus.png");
}
.cuselOpen {
z-index: 999;
}
/*
styles for disabled select
*/
.classDisCusel,
.classDisCusel .cuselFrameRight {
background-image: url("../pics/selects-2-dis.png") !important;
cursor: default;
color: #575756;
}
.classDisCusel .cuselText {
cursor: default;
}
/*
styles for scrollbar
*/
.cusel .cusel-scroll-wrap {
display: block;
visibility: hidden;
position: absolute;
left: 0;
top: 100%;
background: #fff;
width: 198px;
border: 1px solid #dcdcdc;
border-top: none;
margin-top: 0px;
}
.cusel .jScrollPaneContainer {
position: relative;
overflow: hidden;
z-index: 5;
border: 1px solid #999;
}
.cusel .jScrollPaneTrack {
height: 100%;
width: 7px !important;
background: #ccc;
position: absolute;
top: 0;
right: 4px;
}
.cusel .jScrollPaneDrag {
position: absolute;
background-position: -40px -26px;
cursor: pointer;
width: 15px !important;
height: 27px !important;
right: -4px;
}
.cusel .jScrollPaneDragTop {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
}
.cusel .jScrollPaneDragBottom {
position: absolute;
bottom: 0;
left: 0;
overflow: hidden;
}
.cusel .jScrollArrowUp {
position: absolute;
top: 0;
right: 2px;
width: 26px;
height: 12px;
cursor: pointer;
background-position: -2px -26px;
overflow: hidden;
}
.cusel .jScrollArrowDown {
width: 25px;
height: 12px;
position: absolute;
top: auto;
bottom: 0;
right: 3px;
cursor: pointer;
background-position: -21px -26px;
overflow: hidden;
}