scroll-animation-initial-offset-ref.html (678B)
1 <!DOCTYPE html> 2 <style> 3 4 #scroller { 5 overflow-y: auto; 6 height: 200px; 7 border: 2px solid green; 8 position: relative; 9 background: gray; 10 } 11 12 .spacer { 13 height: 1000px; 14 } 15 16 #align { 17 box-sizing: border-box; 18 width: 100%; 19 height: 50px; 20 background: rgba(0, 0, 200, 0.2); 21 color: white; 22 position: absolute; 23 border: 1px solid white; 24 transform: translateY(200px); 25 will-change: transform; 26 } 27 28 #marker { 29 width: 100%; 30 height: 50px; 31 background: #640; 32 position: absolute; 33 top: 350px; 34 } 35 36 </style> 37 <div id="scroller"> 38 <div id="align">TOP</div> 39 <div class="spacer"></div> 40 <div id="marker">BOTTOM</div> 41 </div> 42 <script> 43 scroller.scrollTo(0, 200); 44 </script>