How can I map a horizontal scrollbar to a div within the page?
<p>Let's say I have two divs on a page like this:</p>

<pre><code>&lt;div style="width:300px;height:100px;overflow:hidden"&gt;
  &lt;div style="width:3000px;height:100px"&gt;
  some content
  &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>and let's assume that the outer div is positioned somewhere in the middle of the page.</p>

<p>Is there a possibility to "map" the global document scrollbar to that div so it's possible to use the mouse's / trackpad's horizontal scrolling feature to move that inner div to left and right?</p>

<p>I hope it's clear what I am trying to do...</p>
