| <style> |
| div { |
| width: 100px; |
| height: 100px; |
| } |
| .container { |
| position: absolute; |
| top: 100px; |
| } |
| #contains-paint { |
| contain: paint; |
| } |
| #has-transform { |
| will-change: transform; |
| } |
| .fixed { |
| position: fixed; |
| top: 0; |
| } |
| .spacer { |
| height: 2000px; |
| } |
| </style> |
| <script> |
| onload = function() { |
| window.scrollTo(0, 50); |
| }; |
| </script> |
| <div class="container" id="simple-container"><div id="fixed1" class="fixed"></div></div> |
| <div class="container" id="has-transform"><div id="fixed2" class="fixed"></div></div> |
| <div class="container" id="contains-paint"><div id="fixed3" class="fixed"></div></div> |
| <div class="spacer"></div> |