tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

vertical-scroll-scrollintoview.html (1002B)

      1 <!DOCTYPE html>
      2 <style>
      3 html, body, #container {
      4  width: 100%;
      5  height: 100%;
      6 }
      7 
      8 #spacer {
      9  width: 200%;
     10  height: 200%;
     11 }
     12 </style>
     13 <div id="container">
     14  <div id="spacer"></div>
     15  <button>Element To Scroll</button>
     16 </div>
     17 <script>
     18  window.addEventListener('message', onMessageReceived);
     19 
     20  function scrollingElementBounds() {
     21    var rect = document.querySelector("button").getBoundingClientRect();
     22    return {
     23        x: rect.x, y: rect.y, width: rect.width, height: rect.height
     24      };
     25  }
     26 
     27  function onMessageReceived(e) {
     28    if (!e.data || !e.data.type)
     29      return;
     30    switch(e.data.type) {
     31      case "scroll":
     32        document.querySelector("button").scrollIntoView({behavior: "instant"});
     33        ackMessage({bounds: scrollingElementBounds()}, e.source);
     34      break;
     35 
     36      case "scrolling-element-bounds":
     37        ackMessage({bounds: scrollingElementBounds()}, e.source);
     38      break;
     39    }
     40  }
     41 
     42  function ackMessage(msg, source) {
     43    source.postMessage(msg, "*");
     44  }
     45 </script>