Chromium Code Reviews| OLD | NEW |
|---|---|
| (Empty) | |
| 1 <style> | |
| 2 body { | |
| 3 margin: 0; | |
| 4 } | |
| 5 | |
| 6 .scroller { | |
| 7 /* TODO(smcgruer): Appears to be a paint bug if the scroller is composited. */ | |
|
flackr
2017/03/17 15:01:56
What is the bug? We shouldn't be trying to do stic
smcgruer
2017/03/17 17:36:52
Filed crbug.com/702637 and reverted this LayoutTes
| |
| 8 /* will-change: transform; */ | |
| 9 | |
| 10 overflow: auto; | |
| 11 width: 200px; | |
| 12 height: 350px; | |
| 13 outline: 2px solid black; | |
| 14 } | |
| 15 | |
| 16 .container { | |
| 17 width: 200px; | |
| 18 height: 700px; | |
| 19 } | |
| 20 | |
| 21 .outerSticky { | |
| 22 will-change: transform; | |
| 23 | |
| 24 display: inline; | |
| 25 position: sticky; | |
| 26 top: 0; | |
| 27 } | |
| 28 | |
| 29 .innerSticky { | |
| 30 will-change: transform; | |
| 31 | |
| 32 display: inline; | |
| 33 position: sticky; | |
| 34 top: 25px; | |
| 35 } | |
| 36 </style> | |
| 37 | |
| 38 <script> | |
| 39 if (window.testRunner) | |
| 40 testRunner.waitUntilDone(); | |
| 41 | |
| 42 function finishTest() { | |
| 43 document.querySelector('.scroller').scrollTop = 200; | |
| 44 if (window.testRunner) | |
| 45 testRunner.notifyDone(); | |
| 46 } | |
| 47 | |
| 48 window.addEventListener('load', function() { | |
| 49 requestAnimationFrame(function() { | |
| 50 requestAnimationFrame(finishTest); | |
| 51 }); | |
| 52 }); | |
| 53 </script> | |
| 54 | |
| 55 <div class="scroller"> | |
| 56 <div class="container"> | |
| 57 <div class="outerSticky">1<div class="innerSticky">2</div></div> | |
| 58 </div> | |
| 59 </div> | |
| OLD | NEW |