70 lines
2.0 KiB
HTML
70 lines
2.0 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
</head>
|
|
<script>
|
|
|
|
function setWindowRect(win, clientRect, fromWindow) {
|
|
if (win) {
|
|
var desktopLeft = fromWindow.screenLeft - fromWindow.screen.availLeft;
|
|
var desktopTop = fromWindow.screenTop - fromWindow.screen.availTop;
|
|
|
|
win.moveTo(clientRect.left + desktopLeft, clientRect.top + desktopTop);
|
|
win.resizeTo(clientRect.width, clientRect.height);
|
|
}
|
|
}
|
|
|
|
function createEqual(div, fromWindow) {
|
|
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");
|
|
win.document.write("<style>body { margin: 0 }</style><body></body>");
|
|
win.document.getElementsByTagName('body')[0].innerHTML = div.outerHTML;
|
|
setWindowRect(win, div.getClientRects()[0], fromWindow);
|
|
return win;
|
|
}
|
|
|
|
var window1;
|
|
var window2;
|
|
|
|
function runTests() {
|
|
var div1 = document.getElementsByTagName('div')[1];
|
|
var div2 = document.getElementsByTagName('div')[2];
|
|
|
|
window1 = createEqual(div1, window);
|
|
window2 = createEqual(div2, window);
|
|
|
|
window.onscroll = function() {
|
|
setWindowRect(window1, div1.getClientRects()[0], window);
|
|
setWindowRect(window2, div2.getClientRects()[0], window);
|
|
}
|
|
|
|
start = Date.now();
|
|
sign = 1;
|
|
|
|
function step(timestamp) {
|
|
var progress = timestamp - start;
|
|
var before = document.body.scrollTop;
|
|
window.scrollBy(0, 10 * sign);
|
|
if (before == document.body.scrollTop) {
|
|
sign = sign * -1;
|
|
}
|
|
|
|
requestAnimationFrame(step);
|
|
}
|
|
scrollTo(0, 0);
|
|
requestAnimationFrame(step);
|
|
}
|
|
|
|
function endTests() {
|
|
window1.close();
|
|
window2.close();
|
|
}
|
|
</script>
|
|
<body onload="runTests()" onunload="endTests()">
|
|
<div style="height: 1000px"></div>
|
|
<div style="background-color: red; width: 400px; height: 100px;"></div>
|
|
<br>
|
|
<div style="background-color: blue; width: 200px; height: 200px; float: right"></div>
|
|
<div style="height: 1000px"></div>
|
|
</body>
|
|
</html>
|