Files
openlayers/theme/default/style.mobile.css
ahocevar 774e983631 Turning on GPU for the tiles only turns out to be faster
Especially on iOS 6, this gives way better performance. And it does not
seem to cause any additional flicker.
2013-01-09 14:38:18 +01:00

68 lines
1.7 KiB
CSS

div.olControlZoom {
position: absolute;
top: 8px;
left: 8px;
background: rgba(255,255,255,0.4);
border-radius: 4px;
padding: 2px;
}
* {
-webkit-tap-highlight-color: rgba(0, 0, 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: #130085; /* fallback for IE - IE6 requires background shorthand*/
background: rgba(0, 60, 136, 0.5);
filter: alpha(opacity=80);
}
a.olControlZoomIn {
border-radius: 4px 4px 0 0;
}
a.olControlZoomOut {
border-radius: 0 0 4px 4px;
}
div.olControlZoom a:hover {
background: #130085; /* fallback for IE */
background: rgba(0, 60, 136, 0.7);
filter: alpha(opacity=100);
}
@media only screen and (max-width: 600px) {
div.olControlZoom a:hover {
background: rgba(0, 60, 136, 0.5);
}
}
.olLayerGrid .olTileImage {
-webkit-transition: opacity 0.2s linear;
-moz-transition: opacity 0.2s linear;
-o-transition: opacity 0.2s linear;
transition: opacity 0.2s linear;
}
/* Turn on GPU support where available */
.olTileImage {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
-o-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-perspective: 1000;
-moz-perspective: 1000;
-ms-perspective: 1000;
perspective: 1000;
}