third_party/WebKit/LayoutTests/compositing/squashing/universal-accelerated-overflow-scrolling.html

   1 <!DOCTYPE html>
   2 <html>
   3   <head>
   4     <style>
   5       #container {
   6         width: 300px;
   7         height: 300px;
   8         border: 3px solid black;
   9         overflow: scroll;
  10       }
  11
  12       .card {
  13         width: 100px;
  14         height: 100px;
  15         margin: 5px;
  16       }
  17
  18       .fixed {
  19         position: fixed;
  20         background: blue;
  21         z-index: 1;
  22         left: 80px;
  23         top: 80px;
  24       }
  25
  26       .scrolled {
  27         position: relative;
  28         background: green;
  29       }
  30     </style>
  31     <script>
  32       if (window.testRunner)
  33           testRunner.dumpAsTextWithPixelResults();
  34
  35       if (window.internals)
  36           window.internals.settings.setPreferCompositingToLCDTextEnabled(true);
  37
  38       function doTest() {
  39         var container = document.getElementById("container");
  40         container.scrollTop = container.scrollHeight;
  41       }
  42
  43       window.onload = doTest;
  44     </script>
  45   </head>
  46   <body>
  47     <div id="container">
  48       <div class="fixed card"></div>
  49       <div class="scrolled card"></div>
  50       <div class="scrolled card"></div>
  51       <div class="scrolled card"></div>
  52       <div class="scrolled card"></div>
  53       <div class="scrolled card"></div>
  54       <div class="scrolled card"></div>
  55       <div class="scrolled card"></div>
  56       <div class="scrolled card"></div>
  57       <div class="scrolled card"></div>
  58       <div class="scrolled card"></div>
  59       <div class="scrolled card"></div>
  60       <div class="scrolled card"></div>
  61     </div>
  62   </body>
  63 </html>