| <!-- |
| @BLINK-ALLOW:location=(8, 70) |
| @BLINK-WAIT-FOR:done |
| @BLINK-WAIT-FOR:location=(8, 70) |
| --> |
| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| #positioned { |
| position:fixed; |
| top:50px; |
| height: 100px; |
| width: 200px; |
| font-size:40px; |
| background: #555; |
| } |
| #heading_list { |
| padding-top: 100px; |
| font-size:40px; |
| } |
| </style> |
| </head> |
| <body onload="onLoad()"> |
| <button onclick="clicked()">Scroll</button> |
| <div id="positioned">title</div> |
| <div id="heading_list"> |
| <h2>Heading #1</h2> |
| <h2>Heading #2</h2> |
| <h2>Heading #3</h2> |
| <h2>Heading #4</h2> |
| <h2>Heading #5</h2> |
| <h2>Heading #6</h2> |
| <h2>Heading #7</h2> |
| <h2>Heading #8</h2> |
| </div> |
| <div id="statusDiv"></div> |
| <script> |
| function onLoad() { |
| window.requestAnimationFrame(() => { |
| window.onscroll = function() { |
| window.requestAnimationFrame(() => { |
| statusDiv.innerText = "done"; |
| }); |
| }; |
| window.requestAnimationFrame(() => { |
| document.querySelector('button').click(); |
| }); |
| }); |
| } |
| |
| function clicked() { |
| window.requestAnimationFrame(() => { |
| window.scrollTo(0, 20); |
| }); |
| } |
| </script> |
| </body> |
| </html> |