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

Better way to get GPU support, and avoid flicker

Browse Source 
These declarations were suggested on
http://blog.teamtreehouse.com/increase-your-sites-performance-with-hardware-accelerated-css
This commit is contained in:
ahocevar
2012-12-21 08:27:13 +01:00
parent afe53aba7d
commit d2b3bded72
3 changed files with 39 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
examples/mobile-wmts-vienna.css
+13 -5
View File
@@ -15,11 +15,19 @@ html, body, #map {
/* Turn on GPU support where available */ /* Turn on GPU support where available */
.olMapViewport, .olMapViewport * { .olMapViewport, .olMapViewport * {
-webkit-transform: translate3d(0,0,0); -webkit-transform: translateZ(0);
-moz-transform: translate3d(0,0,0); -moz-transform: translateZ(0);
-o-transform: translate3d(0,0,0); -o-transform: translateZ(0);
-ms-transform: translate3d(0,0,0); -ms-transform: translateZ(0);
transform: translate3d(0,0,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;
} }
.olLayerDiv svg * { .olLayerDiv svg * {
-webkit-transform: none; -webkit-transform: none;
theme/default/style.css
+13 -5
View File
@@ -489,11 +489,19 @@ a.olControlZoomOut {
/* Turn on GPU support where available */ /* Turn on GPU support where available */
.olMapViewport, .olMapViewport * { .olMapViewport, .olMapViewport * {
-webkit-transform: translate3d(0,0,0); -webkit-transform: translateZ(0);
-moz-transform: translate3d(0,0,0); -moz-transform: translateZ(0);
-o-transform: translate3d(0,0,0); -o-transform: translateZ(0);
-ms-transform: translate3d(0,0,0); -ms-transform: translateZ(0);
transform: translate3d(0,0,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;
} }
.olLayerDiv svg * { .olLayerDiv svg * {
-webkit-transform: none; -webkit-transform: none;
theme/default/style.mobile.css
+13 -5
View File
@@ -51,11 +51,19 @@ div.olControlZoom a:hover {
} }
/* Turn on GPU support where available */ /* Turn on GPU support where available */
.olMapViewport, .olMapViewport * { .olMapViewport, .olMapViewport * {
-webkit-transform: translate3d(0,0,0); -webkit-transform: translateZ(0);
-moz-transform: translate3d(0,0,0); -moz-transform: translateZ(0);
-o-transform: translate3d(0,0,0); -o-transform: translateZ(0);
-ms-transform: translate3d(0,0,0); -ms-transform: translateZ(0);
transform: translate3d(0,0,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;
} }
.olLayerDiv svg * { .olLayerDiv svg * {
-webkit-transform: none; -webkit-transform: none;