1<!DOCTYPE HTML> 2 3<!-- READ BEFORE UPDATING: 4If this test is updated make sure to increment the "revision" value of the 5associated test in content/test/gpu/page_sets/pixel_tests.py. This will ensure 6that the baseline images are regenerated on the next run. 7--> 8 9<html> 10<head> 11<title>CSS 3D Test: Projected Blue Box over Black Background</title> 12<style type="text/css"> 13#container { 14 -webkit-perspective: 500; 15} 16 17#container > div { 18 position: relative; 19 margin: 50px; 20 width: 125px; 21 height: 75px; 22} 23 24#container > :first-child { 25 background-color: blue; 26 -webkit-transform: rotateY(45deg); 27} 28</style> 29<script> 30var g_swapsBeforeAck = 15; 31 32function main() 33{ 34 waitForFinish(); 35} 36 37function waitForFinish() 38{ 39 if (g_swapsBeforeAck == 0) { 40 domAutomationController.setAutomationId(1); 41 domAutomationController.send("SUCCESS"); 42 } else { 43 g_swapsBeforeAck--; 44 document.getElementById('blue_box').style.zIndex = g_swapsBeforeAck + 1; 45 window.webkitRequestAnimationFrame(waitForFinish); 46 } 47} 48</script> 49</head> 50<body onload="main()"> 51<div style="position:relative; width:200px; height:200px; background-color:black; zindex-0"> 52</div> 53<div id="container" style="position:absolute; top:0px; left:0px"> 54 <div id="blue_box"></div> 55</div> 56</body> 57</html> 58