~jstys-z/helioviewer.org/client5

« back to all changes in this revision

Viewing changes to resources/css/zoom-control.css

  • Committer: Michael Lynch
  • Date: 2008-02-01 06:21:07 UTC
  • Revision ID: mike@mike-desktop-20080201062107-uhqip0rcpsfc91mq
Initial import

Show diffs side-by-side

added added

removed removed

Lines of Context:
1
 
/* Zoom Level Slider */
2
 
#zoomControls {
3
 
    position: absolute;
4
 
    left: 2.5em;
5
 
    top: 2em;
6
 
    z-index:20;
7
 
}
8
 
 
9
 
#zoomControlSlider {
10
 
    background: transparent none repeat scroll 0 0;
11
 
    width: 100%;
12
 
    height: 190px;
13
 
    margin-top: 8px;
14
 
    border: none;
15
 
        border-radius: 0px;
16
 
    -moz-border-radius: 0px;
17
 
    -webkit-border-radius: 0px;
18
 
}
19
 
 
20
 
#zoomSliderContainer {
21
 
    position: absolute;
22
 
        left:8px;
23
 
        top:22px;
24
 
        height:212px;
25
 
        width:4px;
26
 
    background-color: rgba(255,255,255,0.5);
27
 
    color: black;
28
 
    border: 2px solid rgba(0,0,0,1);
29
 
        text-align:center;
30
 
        z-index: 9999;
31
 
}
32
 
 
33
 
#zoomControlSlider > .ui-slider-handle {
34
 
        left:-10px;
35
 
        width:20px;
36
 
        height:10px;
37
 
    background-image: none;
38
 
    background-color: rgba(230,230,230,1);
39
 
    color: black;
40
 
    border: 2px solid rgba(0,0,0,1);;
41
 
    border-radius: 0.2em;
42
 
    -moz-border-radius-bottomleft: 0.2em;
43
 
    -webkit-border-bottom-left-radius: 0.2em;
44
 
        cursor: pointer;
45
 
        text-align:center;
46
 
        font-weight:bold;
47
 
        z-index: 10000;
48
 
}
49
 
 
50
 
#zoomControlZoomOut, #zoomControlZoomIn {
51
 
    position: absolute;
52
 
        background-color: rgba(230,230,230,1);
53
 
        color: black;
54
 
    border: 2px solid rgba(0,0,0,1);
55
 
    border-radius: 2em;
56
 
    -moz-border-radius-bottomleft: 2em;
57
 
    -webkit-border-bottom-left-radius: 2em;
58
 
        left: 0px;
59
 
        cursor:pointer;
60
 
        text-align: center;
61
 
        font-size: 2em;
62
 
        font-weight: 400;
63
 
        z-index: 10000;
64
 
    width: 0.8em;
65
 
    height: 0.8em;
66
 
    line-height: 0.6em;
67
 
    -webkit-touch-callout: none;
68
 
    -webkit-user-select: none;
69
 
    -khtml-user-select: none;
70
 
    -moz-user-select: none;
71
 
    -ms-user-select: none;
72
 
    user-select: none;
73
 
}
74
 
 
75
 
#zoomControlZoomOut {
76
 
    top:235px;
77
 
    line-height: 0.66em;
78
 
}
79
 
#zoomControlZoomIn  {
80
 
    top: 0px;
81
 
}
82
 
 
83
 
#zoomControlZoomOut:hover, #zoomControlZoomIn:hover, #zoomControlSlider > .ui-slider-handle:hover {
84
 
    background-color: rgba(255,255,255,1);
85
 
    border: 2px solid rgba(0,0,0,1);
86
 
}
87
 
 
88
 
#zoomControlZoomOut:active, #zoomControlZoomIn:active, #zoomControlSlider > .ui-slider-handle:active {
89
 
    background-color: yellow;
90
 
    border: 2px solid rgba(0,0,0,1);
91
 
}