1 <!DOCTYPE html> 2 <html> 3 <head> 4 </head> 5 <script> 6 7 function setWindowRect(win, clientRect, fromWindow) { 8 if (win) { 9 var desktopLeft = fromWindow.screenLeft - fromWindow.screen.availLeft; 10 var desktopTop = fromWindow.screenTop - fromWindow.screen.availTop; 11 12 win.moveTo(clientRect.left + desktopLeft, clientRect.top + desktopTop); 13 win.resizeTo(clientRect.width, clientRect.height); 14 } 15 } 16 17 function createEqual(div, fromWindow) { 18 win = window.open("about:blank", "", "location=no, resizable=no, scrollbars=no, status=no, titlebar=no, toolbar=no, left=0, top=0, width=1, height=1"); 19 win.document.write("<style>body { margin: 0 }</style><body></body>"); 20 win.document.getElementsByTagName('body')[0].innerHTML = div.outerHTML; 21 setWindowRect(win, div.getClientRects()[0], fromWindow); 22 return win; 23 } 24 25 var window1; 26 var window2; 27 28 function runTests() { 29 var div1 = document.getElementsByTagName('div')[1]; 30 var div2 = document.getElementsByTagName('div')[2]; 31 32 window1 = createEqual(div1, window); 33 window2 = createEqual(div2, window); 34 35 window.onscroll = function() { 36 setWindowRect(window1, div1.getClientRects()[0], window); 37 setWindowRect(window2, div2.getClientRects()[0], window); 38 } 39 40 start = Date.now(); 41 sign = 1; 42 43 function step(timestamp) { 44 var progress = timestamp - start; 45 var before = document.body.scrollTop; 46 window.scrollBy(0, 10 * sign); 47 if (before == document.body.scrollTop) { 48 sign = sign * -1; 49 } 50 51 requestAnimationFrame(step); 52 } 53 scrollTo(0, 0); 54 requestAnimationFrame(step); 55 } 56 57 function endTests() { 58 window1.close(); 59 window2.close(); 60 } 61 </script> 62 <body onload="runTests()" onunload="endTests()"> 63 <div style="height: 1000px"></div> 64 <div style="background-color: red; width: 400px; height: 100px;"></div> 65 <br> 66 <div style="background-color: blue; width: 200px; height: 200px; float: right"></div> 67 <div style="height: 1000px"></div> 68 </body> 69 </html> 70
