title: Stop page from scrolling if hovering div
body: <p>I have a div that is scrollable, but whenever you reach the bottom/top of it, it begins to scroll the entire page. That could be annoying for users who scroll fast, and then the entire page starts scrolling unexpectedly.</p>
  
  <p>I need something where if you are hovering over the div, the page is not scrollable.</p>
  
  <p>I have tried this by adding CSS when I hover the div...</p>
  
  <pre><code>body {
      overflow:hidden;
  }
  </code></pre>
  
  <p>...It works but there is one problem. The scrollbar disappears and that looks kind of stupid to have it disappearing/reappearing. Any way to achieve the same effect but keep the scrollbar visible? I have seen it done with Facebook chat.</p>