demoStyles.css in JScrollPane 5
/* Stylesheet for my demo pages for jScrollPane - these styles aren't necessary for using jScrollPane and aren't specific to any particular example */
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 80%;
}
a.jScrollArrowUp {
background: url(../images/basic_arrow_up.gif) repeat-x 0 0;
}
a.jScrollArrowUp:hover {
background-position: 0 -15px;
}
a.jScrollArrowDown {
background: url(../images/basic_arrow_down.gif) repeat-x 0 0;
}
a.jScrollArrowDown:hover {
background-position: 0 -15px;
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
background-position: 0 -30px;
}
.orange-bar .jScrollPaneTrack {
background: #f60;
}
.orange-bar .jScrollPaneDrag {
background: #00f url(../images/drag_grab.gif) no-repeat 50% 50%;
}
.orange-bar .scroll-pane {
background: #69f;
}
.holder {
float: left;
margin: 10px;
}
.scroll-pane {
width: 200px;
height: 200px;
overflow: auto;
background: #ccc;
float: left;
}
.wide {
width: 400px;
}
.super-wide {
width: 700px;
}
.tall {
height: 400px;
}
#pane1 {
}
#pane2 {
height: 150px;
}
#pane3 {
height: 190px;
}
#pane4 {
height: 190px;
}
File
demo/demoStyles.css
View source
- /* Stylesheet for my demo pages for jScrollPane - these styles aren't necessary for using jScrollPane and aren't specific to any particular example */
-
- body {
- font-family: Arial, Helvetica, sans-serif;
- font-size: 80%;
- }
-
- a.jScrollArrowUp {
- background: url(../images/basic_arrow_up.gif) repeat-x 0 0;
- }
- a.jScrollArrowUp:hover {
- background-position: 0 -15px;
- }
- a.jScrollArrowDown {
- background: url(../images/basic_arrow_down.gif) repeat-x 0 0;
- }
- a.jScrollArrowDown:hover {
- background-position: 0 -15px;
- }
- a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
- background-position: 0 -30px;
- }
-
-
- .orange-bar .jScrollPaneTrack {
- background: #f60;
- }
- .orange-bar .jScrollPaneDrag {
- background: #00f url(../images/drag_grab.gif) no-repeat 50% 50%;
- }
- .orange-bar .scroll-pane {
- background: #69f;
- }
-
- .holder {
- float: left;
- margin: 10px;
- }
-
- .scroll-pane {
- width: 200px;
- height: 200px;
- overflow: auto;
- background: #ccc;
- float: left;
- }
-
- .wide {
- width: 400px;
- }
-
- .super-wide {
- width: 700px;
- }
-
- .tall {
- height: 400px;
- }
-
- #pane1 {
- }
- #pane2 {
- height: 150px;
- }
- #pane3 {
- height: 190px;
- }
- #pane4 {
- height: 190px;
- }