1 <!DOCTYPE HTML> 2 3 <!-- READ BEFORE UPDATING: 4 If this test is updated make sure to increment the "revision" value of the 5 associated test in content/test/gpu/page_sets/pixel_tests.py. This will ensure 6 that 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> 30 var g_swapsBeforeAck = 15; 31 32 function main() 33 { 34 waitForFinish(); 35 } 36 37 function 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
