Q:

how to make horizontal scroll like metro?

I need make something similar to Windows 8's Metro style horizontal scrolling.  For example, when the user moves the mouse in corner, the scrollers move with it.
I tried this code:
$(document).ready(function() {

    document.documentElement.onmousewheel = function (event) {
        $('body').scrollLeft($('body').scrollLeft() - event.wheelDelta);
    };
});

But the horizontal scrolling is not quite working as I'd expect it to.
How should I make a Windows 8 style horizontal scroll?

A:

I found the answer:
To get horizontal scrolling the Mouse Wheel Plugin by Brandon Aaron (GitHub, Download) will be used to detect mouse wheel movements like a keypress and of course, jQuery itself will be used.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="js/jquery.mousewheel.js"></script>

Javascript
$(document).ready(function() {
$('html, body, *').mousewheel(function(e, delta) {
    this.scrollLeft -= (delta * 40);
    e.preventDefault();
});
})

The JavaScript can just be added into the Head tag. Note that scrolling applies to html, body and * (everything) – this enables it to work across different browsers. The event.preventDefault() just disables vertical scrolling.

