title: mapbox: activate zoom when scrolling up at the top of the page; move page down when map is zoomed out
body: <p>I would like mapbox to have control over the scroll-wheel when the page is scrolled to the top and the user keeps scrolling up</p>
  <p>For scrolling down: when the map is zoomed all the way out (scrolling down), I want control over the scroll-wheel to go back to the browser so they can scroll down (until they scroll back to the top again).</p>
  <p>maybe there is a better way to do this</p>
  <p>right now it kind of works but it is buggy and I'm not sure how to improve it</p>
  <p>This is what I have so far:</p>
  <pre><code>
      map.on('zoomstart', () =&gt; {
          if (10 &lt; window.scrollY) map.scrollZoom.disable()
      })
  
      map.on('idle', () =&gt; {
          if (window.scrollY &lt;= 10) map.scrollZoom.enable()
      })
  
  
      map.on('zoomend', async () =&gt; {
          const [[s, w], [n, e]] = map.getBounds().toArray()
  
          if ((w &lt; -179.9 &amp;&amp; 179.9 &lt; e) || (s &lt; -73.9 &amp;&amp; 82.9 &lt; n)) {
              window.scrollTo({ top: window.scrollY + window.innerHeight * 0.1 })
              map.fitBounds(
                  [
                      [170, 25],
                      [-170, 25],
                  ],
                  { animate: false },
              )
          }
      })
  </code></pre>