<!DOCTYPE html >
<html lang="en" class="reftest-wait" ><head >
<meta http-equiv="content-type" content="text/html; charset=UTF-8" ><meta charset="utf-8" >
<title >Bug 1443027 - Test merging across multiple paints</title >
<style >
body { opacity: 0 .9 ; }
div {
position: absolute;
}
#A {
left: 250 px;
top: 50 px;
width: 100 px;
height: 100 px;
background-color: red;
}
#B {
left: 200 px;
top: 0 px;
width: 100 px;
height: 100 px;
background-color: yellow;
}
#C {
left: 0 px;
top: 0 px;
width: 100 px;
height: 100 px;
background-color: green;
}
#D {
left: 80 px;
top: 20 px;
width: 140 px;
height: 100 px;
background-color: blue;
}
</style >
</head >
<body >
<div id="A" ></div >
<div id="B" ></div >
<div id="C" ></div >
<div id="D" ></div >
<script >
var A = document.getElementById("A" );
var B = document.getElementById("B" );
var C = document.getElementById("C" );
var D = document.getElementById("D" );
A .style .visibility = "hidden" ;
B .style .visibility = "hidden" ;
C.style .visibility = "hidden" ;
D.style .visibility = "hidden" ;
window.addEventListener("MozReftestInvalidate" , step1);
function step1() {
A .style .visibility = "visible" ;
A .style .transform = "translatez(1px)" ;
B .style .visibility = "visible" ;
B .style .transform = "translatez(1px)" ;
D.style .visibility = "visible" ;
D.style .transform = "translatez(1px)" ;
window.requestAnimationFrame(function() { window.requestAnimationFrame(step2); });
}
function step2() {
C.style .visibility = "visible" ;
C.style .transform = "translatez(1px)" ;
window.requestAnimationFrame(step3);
}
function step3() {
D.style .visibility = "hidden" ;
D.style .transform = "" ;
document.documentElement.removeAttribute('class' );
}
</script >
</body ></html >
Messung V0.5 in Prozent C=100 H=100 G=100
¤ Dauer der Verarbeitung: 0.3 Sekunden
¤
*© Formatika GbR, Deutschland