51 lines
1.3 KiB
HTML
51 lines
1.3 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>This tests that we properly position render layers when composition is introduced.</title>
|
|
<style>
|
|
div {
|
|
background-color: black;
|
|
position: absolute;
|
|
}
|
|
.parent {
|
|
background-color: red;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<p id="container"></p>
|
|
<script>
|
|
var childPos = -2;
|
|
function createGrid(topPos, leftPos) {
|
|
var container = document.getElementById("container");
|
|
localTopPos = topPos;
|
|
localLeftPos = leftPos;
|
|
for (var i = 0; i < 10; ++i, localTopPos = localTopPos + 7) {
|
|
localLeftPos = leftPos;
|
|
for (var j = 0; j < 10; ++j, localLeftPos = localLeftPos + 7, childPos = childPos < 2 ? childPos + 0.1 : -2) {
|
|
var outer = document.createElement("div");
|
|
outer.className = "parent";
|
|
outer.style.top = localTopPos + "px";
|
|
outer.style.left = localLeftPos + "px";
|
|
outer.style.width = "4px";
|
|
outer.style.height = "4px";
|
|
|
|
var inner = document.createElement("div");
|
|
inner.style.top = childPos + "px";
|
|
inner.style.left = childPos + "px";
|
|
inner.style.width = "2px";
|
|
inner.style.height = "2px";
|
|
|
|
outer.appendChild(inner);
|
|
container.appendChild(outer);
|
|
}
|
|
}
|
|
}
|
|
|
|
for (var i = 0; i < 10; ++i)
|
|
createGrid(i * 0.1, i * 70.1);
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|