How to do a horizontal scroll on mouse wheel scroll ?

Question

Just now, accidentally, i stumble upon http://www.benekdesign.com/ . Here on mouse wheel scroll it performs horizontal scroll. Truly speaking i didn't like this feature. It was a bit irritating. But still, Please tell me how to achieve the same.

Edited

Okay, firebug says he is using

/* Horizontal Tiny Scrolling - a smooth scrolling script for horizontal websites 2(the brother of the vertical "Tiny Scrolling") 3by Marco Rosella - http://www.centralscrutinizer.it/en/design/js-php/horizontal-tiny-scrolling 4 v0.6 - February 14, 2007

Answer 1

You may take a look at the scrollable plugin.

Answer 2

It looks like he's just mapping the mouse wheel to the horizontal bar in the onmousewheel event. In IE, this is really easy by just using the doScroll() method:

document.documentElement.onmousewheel = function ()
{
    if (document.body.doScroll)
        document.body.doScroll(event.wheelDelta>0?"left":"right");

    return false;
}

This will scroll the horizontal bar by the amount the vertical bar would normally scroll by. Other browsers don't support the doScroll() method, so you have to live with scrolling by an abitrary amount instead:

EDIT Just learned that Firefox doesn't support onmousewheel as of 3.x, updated code below.

var mouseWheelEvt = function (e)
{
    var event = e || window.event;
    if (document.body.doScroll)
        document.body.doScroll(event.wheelDelta>0?"left":"right");
    else if ((event.wheelDelta || event.detail) > 0)
        document.body.scrollLeft -= 10;
    else
        document.body.scrollLeft += 10;

    return false;
}
if ("onmousewheel" in document.body)
    document.body.onmousewheel = mouseWheelEvt;
else
    document.body.addEventListener("DOMMouseScroll", mouseWheelEvt);