src/third_party/WebKit/LayoutTests/fast/repaint/fixed-tranformed.html

   1 <!DOCTYPE html>
   2
   3 <html>
   4 <head>
   5 <style type="text/css" media="screen">
   6     body {
   7         height: 1000px;
   8         margin: 0;
   9     }
  10     #test {
  11       width: 100px;
  12       height: 100px;
  13       background-color: red;
  14       position: fixed;
  15       top: 10px;
  16       left: 10px;
  17       -webkit-transform: translate(50px, 50px);
  18     }
  19
  20     .box:hover {
  21         background-color: green;
  22     }
  23 </style>
  24     <script src="resources/text-based-repaint.js" type="text/javascript"></script>
  25     <script type="text/javascript">
  26        function repaintTest()
  27        {
  28             document.getElementById('test').style.background='green';
  29        }
  30
  31        function setupTest()
  32        {
  33            window.scrollBy(0, 50);
  34            runRepaintTest();
  35        }
  36        window.addEventListener('load', setupTest, false);
  37     </script>
  38 </head>
  39 <body>
  40
  41 <!--
  42     https://bugs.webkit.org/show_bug.cgi?id=36686
  43     Test repainting of a fixed-position element with a transform.
  44     The box should be entirely green.
  45 -->
  46 <div id="test"></div>
  47
  48 </body>
  49 </html>