Преглед изворни кода

better synchronized scrolling

moving the canvas each frame inside rAF
means the browser will scroll the canvas with
the rest of the page even if we don't get
a chance to update it. This removes the
bounce that was there before where our
canvas update was behind the page update.
Gregg Tavares пре 7 година
родитељ
комит
8abb7c805d
1 измењених фајлова са 7 додато и 5 уклоњено
  1. 7 5
      examples/webgl_multiple_elements.html

+ 7 - 5
examples/webgl_multiple_elements.html

@@ -16,19 +16,19 @@
 				font-size:13px;
 
 				background-color: #fff;
-				margin: 0px;
+				margin: 0;
 			}
 
 			#info {
 				position: absolute;
-				top: 0px; width: 100%;
+				top: 0; width: 100%;
 				padding: 5px;
 				text-align:center;
 			}
 
 			#content {
 				position: absolute;
-				top: 0px; width: 100%;
+				top: 0; width: 100%;
 				z-index: 1;
 				padding: 3em 0 0 0;
 			}
@@ -38,8 +38,8 @@
 			}
 
 			#c {
-				position: fixed;
-				left: 0px;
+				position: absolute;
+				left: 0;
 				width: 100%;
 				height: 100%;
 			}
@@ -187,6 +187,8 @@
 
 				updateSize();
 
+				canvas.style.transform = `translateY(${window.scrollY}px)`;
+
 				renderer.setClearColor( 0xffffff );
 				renderer.setScissorTest( false );
 				renderer.clear();