Scroll Horizontal Selector

LESS:

div.container {
    width: 100%;
    height: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;

    div.item {
        width: 40px;
        height: 30px;
        margin-right: 1px;
        background-color: yellow;
        display: inline;
    }

}

Javacsript:

Element.prototype.hScroll = function(options) {
    var selector = this;

    function scroll(obj, evt) {
            var direction = evt.detail ? evt.detail * (-120) : evt.wheelDelta;
            if (direction > 0) {
                    direction = obj.scrollLeft - 120;
            } else {
                    direction = obj.scrollLeft + 120;
            }
            obj.scrollLeft = direction;
            evt.preventDefault();
    }
    //FF doesn't recognize mousewheel as of FF3.x
    var mousewheelevt = (/Firefox/i.test(navigator.userAgent)) ? "DOMMouseScroll" : "mousewheel";
    //if IE (and Opera depending on user setting)
    if (selector.attachEvent) {
            selector.attachEvent("on" + mousewheelevt, function(e) {
                    scroll(selector, e);
            });
    } //WC3 browsers
    else if (selector.addEventListener) {
            selector.addEventListener(mousewheelevt, function(e) {
                    scroll(selector, e);
            }, false);
    }
}

Implementation:

var el = document.getElementById('oScrollMe');
el.hScroll();