content/test/data/gpu/pixel_background.html

   1 <html>
   2 <head>
   3 <meta name="viewport" content="initial-scale=1">
   4 <title>Basic Rasterization Test: Blue Box over Black Background</title>
   5 <style type="text/css">
   6 body {
   7   margin: 0px;
   8   padding: 0px;
   9   background-color: white;
  10 }
  11 #container {
  12   position: relative;
  13   margin: 10px;
  14   width: 200px;
  15   height: 200px;
  16   background-color: black;
  17 }
  18 #blue_box {
  19   position: relative;
  20   top: 50px;
  21   left: 50px;
  22   width: 100px;
  23   height: 100px;
  24   background-color: blue;
  25 }
  26 </style>
  27 <script>
  28 var g_swapsBeforeAck = 15;
  29
  30 function main() {
  31   waitForFinish();
  32 }
  33
  34 function waitForFinish()
  35 {
  36   if (g_swapsBeforeAck == 0) {
  37     domAutomationController.setAutomationId(1);
  38     domAutomationController.send("SUCCESS");
  39   } else {
  40     g_swapsBeforeAck--;
  41     document.getElementById('blue_box').style.zIndex = g_swapsBeforeAck + 1;
  42     window.webkitRequestAnimationFrame(waitForFinish);
  43   }
  44 }
  45 </script>
  46 </head>
  47
  48 <body onload="main()">
  49 <div id="container">
  50   <div id="blue_box"></div>
  51 </div>
  52 </body>
  53 </html>