title: Body overflow:hidden disables scroll by mouse wheel
body: <p>I'm trying to hide default browser vertical scroll-bar like this:</p>
  
  <p><strong>HTML</strong>:</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
          &lt;meta charset="UTF-8"&gt;
          &lt;title&gt;Lider-Bet.com&lt;/title&gt;
          &lt;link rel="stylesheet" type="text/css" href="includes/css/style.css"&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;header&gt;
              &lt;div class="lider-bet-logo"&gt;&lt;/div&gt;
          &lt;/header&gt;
  
          &lt;div id="main-wrapper"&gt;
              ...
          &lt;/div&gt;
  
      &lt;/body&gt;
  &lt;/html&gt; 
  </code></pre>
  
  <p>.</p>
  
  <p><strong>CSS</strong>:</p>
  
  <pre><code>body    {
      background: url('../img/body-background-default.png');
      overflow: hidden;
  }
  
  header  {
      display: block;
      width: 100%;
      height: 42px;
      background-image: url('../img/header-background-default.png');
      background-repeat: repeat-x;
      position: fixed;
      z-index: 999;
  }     
  </code></pre>
  
  <p>It's working until I put <code>position:fixed</code> to <code>&lt;header&gt;</code> tag.</p>
  
  <p>Here is <a href="http://jsfiddle.net/zur4ik/GZn9Y/" rel="nofollow"><strong>JSFiddle link</strong></a></p>
  
  <p><strong>P.S:</strong> On JsFiddle it's not working even without positioning <code>&lt;header&gt;</code> tag to <code>fixed</code>, probably this is some JsFiddle engine matter, so you can try to copy from JsFiddle to your pc and try it.</p>
  
  <p>Thanks in advance.</p>
  
  <p>.</p>
  
  <p><strong>--UPDATE--</strong></p>
  
  <p>Regarding comments I'll explain more detailed:</p>
  
  <p>This page is created to display some data via monitor on the wall, so there will be no physical users, only one client which will scroll automatically on some position.</p>
  
  <p>I wanted to hide scrollbar, but when I do this from CSS, than page is losing scroll option.
  Also I'm trying to keep one <code>&lt;header&gt;</code> object fixed: when page will scroll down, this object must be on top anyway.   </p>
  
  <p>First I thought that this is browser issuer, but then I tried in different browsers and result is same: after hiding scrollbar I can't scroll page when I put <code>position:fixed</code> to <code>&lt;header&gt;</code> object.</p>