ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #1614 from Intermedix/ol-touch-zoomslider

Browse Source 
Add styles for .ol-touch .ol-zoomslider
This commit is contained in:
Marc Jansen
2014-03-24 09:24:23 +01:00
parent 7f5446afff e62e537eed
commit 84463f59d4
2 changed files with 31 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/ol.css
+23 -10
View File
@@ -226,7 +226,7 @@ button.ol-full-screen-true:after {
} }
.ol-zoom .ol-has-tooltip:hover [role=tooltip], .ol-zoom .ol-has-tooltip:hover [role=tooltip],
.ol-zoom .ol-has-tooltip:focus [role=tooltip] { .ol-zoom .ol-has-tooltip:focus [role=tooltip] {
bottom: 1.1em; top: 1.1em;
} }
.ol-full-screen .ol-has-tooltip:hover [role=tooltip], .ol-full-screen .ol-has-tooltip:hover [role=tooltip],
.ol-full-screen .ol-has-tooltip:focus [role=tooltip] { .ol-full-screen .ol-has-tooltip:focus [role=tooltip] {
@@ -237,31 +237,44 @@ button.ol-full-screen-true:after {
.ol-zoomslider { .ol-zoomslider {
position: absolute; position: absolute;
top: 67px; top: 4.5em;
left: 8px; left: .5em;
background: #eee; background: #eee;
background: rgba(255, 255, 255, 0.4); background: rgba(255, 255, 255, 0.4);
border-radius: 4px; border-radius: 4px;
width: 28px;
height: 200px;
outline: none; outline: none;
overflow: hidden; overflow: hidden;
padding: 0;
width: 1.5675em;
height: 200px;
padding: 3px;
margin: 0; margin: 0;
} }
.ol-zoomslider-thumb { .ol-zoomslider-thumb {
position: absolute; position: absolute;
display: block; display: block;
padding: 0;
margin: 2px;
background: #7b98bc; background: #7b98bc;
background: rgba(0,60,136,0.5); background: rgba(0,60,136,0.5);
border-radius: 2px; border-radius: 2px;
outline: none; outline: none;
overflow: hidden; overflow: hidden;
height: 20px; cursor: pointer;
width: 24px;
font-size: 1.14em;
height: 1em;
width: 1.375em;
margin: 3px;
padding: 0;
} }
.ol-touch .ol-zoomslider {
top: 5.5em;
width: 2.052em;
}
.ol-touch .ol-zoomslider-thumb {
width: 1.8em;
}
.ol-zoom-extent button, .ol-zoom-extent button,
.ol-attribution, .ol-attribution,
.ol-full-screen button, .ol-full-screen button,
examples/zoomslider.html
+8 -8
View File
@@ -13,19 +13,19 @@
* The zoomslider in the second map shall be placed between the zoom-in and * The zoomslider in the second map shall be placed between the zoom-in and
* zoom-out buttons. * zoom-out buttons.
*/ */
#map2 .ol-zoom a.ol-zoom-out { #map2 .ol-zoom .ol-zoom-out {
margin-top: 202px; margin-top: 202px;
} }
#map2 .ol-zoomslider { #map2 .ol-zoomslider {
background-color: transparent; background-color: transparent;
top: 34px; top: 2.3em;
left: 9px;
width: 24px;
} }
#map2 .ol-zoomslider-thumb {
border-radius: 2px; #map2 .ol-touch .ol-zoom .ol-zoom-out {
width: 24px; margin-top: 212px;
height: 12px; }
#map2 .ol-touch .ol-zoomslider {
top: 2.75em;
} }
/** /**