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

Merge pull request #321 from tonio/zoomdefault

Browse Source 
Make Zoom control be default instead of PanZoom.
This commit is contained in:
Antoine Abt
2012-03-19 00:50:53 -07:00
parent 926283fa69 b10e6707e6
commit 2b41c8926b
7 changed files with 68 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
examples/mobile.html
View File

@@ -35,36 +35,6 @@
padding : 2px 4px;
border-radius : 5px 0 0 0;
}
div.olControlZoomPanel .olControlZoomInItemInactive,
div.olControlZoomPanel .olControlZoomOutItemInactive {
background: rgba(0,0,0,0.2);
position: absolute;
}
div.olControlZoomPanel .olControlZoomInItemInactive {
border-radius: 5px 5px 0 0;
}
div.olControlZoomPanel .olControlZoomOutItemInactive {
border-radius: 0 0 5px 5px ;
top: 37px;
}
div.olControlZoomPanel .olControlZoomOutItemInactive:after ,
div.olControlZoomPanel .olControlZoomInItemInactive:after{
font-weight: bold;
content : '+';
font-size : 36px;
padding: 7px;
z-index: 2000;
color : #fff;
line-height: 1em;
}
div.olControlZoomPanel .olControlZoomOutItemInactive:after{
content: '–';
line-height: 0.9em;
padding: 0 8px;
}
div.olControlZoomPanel .olControlZoomToMaxExtentItemInactive {
display: none;
}
#title, #tags, #shortdesc {
display: none;
}

2
examples/mobile.js
View File

@@ -26,7 +26,7 @@ var init = function () {
enableKinetic: true
}
}),
new OpenLayers.Control.ZoomPanel()
new OpenLayers.Control.Zoom()
],
layers: [
new OpenLayers.Layer.OSM("OpenStreetMap", null, {

59
examples/style.mobile.css
View File

@@ -1,31 +1,42 @@
div.olControlZoomPanel {
height: 108px;
width: 36px;
div.olControlZoom {
position: absolute;
top: 20px;
left: 20px;
top: 8px;
left: 8px;
}
div.olControlZoomPanel div {
width: 36px;
height: 36px;
background-image: url(img/mobile-zoombar.png);
left: 0;
* {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
div.olControlZoomPanel .olControlZoomInItemInactive {
top: 0;
background-position: 0 0;
div.olControlZoom a {
display: block;
margin: 1px;
padding: 0;
color: white;
font-size: 28px;
font-family: sans-serif;
font-weight: bold;
text-decoration: none;
text-align: center;
height: 32px;
width: 32px;
line-height: 28px;
text-shadow: 0 0 3px rgba(0,0,0,0.8);
background: #666666; /* fallback for IE - IE6 requires background shorthand*/
background: rgba(0, 0, 0, 0.3);
filter: alpha(opacity=60);
}
div.olControlZoomPanel .olControlZoomToMaxExtentItemInactive {
top: 36px;
background-position: 0 -36px;
a.olControlZoomIn {
border-radius: 4px 4px 0 0;
}
div.olControlZoomPanel .olControlZoomOutItemInactive {
top: 72px;
background-position: 0 -72px;
a.olControlZoomOut {
border-radius: 0 0 4px 4px;
}
.olTileImage {
-webkit-transition: opacity 0.2s linear;
-moz-transition: opacity 0.2s linear;
-o-transition: opacity 0.2s linear;
transition: opacity 0.2s linear;
div.olControlZoom a:hover {
background: #444444; /* fallback for IE */
background: rgba(0, 0, 0, 0.5);
filter: alpha(opacity=80);
}
@media only screen and (max-width: 600px) {
div.olControlZoom a:hover {
background: rgba(0, 0, 0, 0.3);
}
}