anchor-scroll-composited-scrolling-006-ref.html (529B)
1 <!DOCTYPE html> 2 <style> 3 body { 4 margin: 0; 5 } 6 #scroller { 7 width: 200px; 8 height: 100px; 9 overflow: scroll; 10 will-change: scroll-position; 11 } 12 #spacer { 13 height: 400px; 14 } 15 #anchor { 16 width: 100px; 17 height: 100px; 18 anchor-name: --a; 19 } 20 #overlap { 21 position: absolute; 22 width: 100px; 23 height: 100px; 24 top: 150px; 25 left: 0; 26 z-index: 100; 27 background: green; 28 } 29 </style> 30 31 <div id="overlap"></div> 32 <div id="scroller"> 33 <div id="spacer"></div> 34 <div id="anchor"></div> 35 </div> 36 37 <script> 38 scroller.scrollTop = 150; 39 </script>