blob: 6d2adeda9bb02050c849ef3c93eddfe60ed76a27 [file] [log] [blame]
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.absolute {
background-color: green;
height: 96px;
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 2;
}
.fixed {
background-color: red;
height: 32px;
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 1;
}
.transformed {
background-color: #6d6d6d;
padding-top: 24px;
margin: 64px 0px 1920px 0px;
width: 100%;
height: 40px;
-webkit-transform: translateZ(0);
}
</style>
<script src="../../fast/repaint/resources/repaint.js"></script>
<script type="text/javascript" charset="utf-8">
if (window.testRunner) {
testRunner.dumpAsText(true);
testRunner.waitUntilDone();
}
function repaintTest()
{
window.scrollBy(0,-96);
if (window.testRunner)
testRunner.notifyDone();
}
function doTest()
{
window.scrollBy(0,-2048);
window.scrollBy(0,160);
runRepaintTest();
}
window.addEventListener('load', doTest, false);
</script>
</head>
<body>
<div class="absolute"></div>
<div class="fixed"></div>
<div class="transformed"></div>
<p> For this test to pass, you should not see a red line when scroll position is less or equal to 64px from the top. </p>
</body>
</html>