关于横向滚动有关问题，请大神写一个简单的DEMO

关于横向滚动问题，请大神写一个简单的DEMO
接触JS很少，有一个功能需要求解。

比如现在需要做一个类似WIN8的页面，需要页面进行横向滚动
就是鼠标上下滚动，页面横向滚动。
IFRAME做也是可以的，这样更好改一些。
具体的效果比如这个网站：http://www.qileke.com/


想知道一下具体的方法，做个简单的DEMO给我就好

onmousewheel事件如何改变scrollLeft  并且造成移动。
谢谢大家，demo最好任何浏览器都可以生效

------解决方案--------------------

<div id="out_div" style="border: 1px solid #ddd;height: 300px;width:99%;overflow: hidden;">

    <div style="width:6000px;height:300px;background: url('http://avatar.profile.csdn.net/3/2/D/1_nojobs.jpg')">

    </div>

</div>

<script type="text/javascript">

    function scrollFunc(e) {

        var direct = 0,i = id.scrollLeft;

        e = e 
------解决方案--------------------
 window.event;

        if (e.wheelDelta) {

            direct = e.wheelDelta;

        } else if (e.detail) {

            direct = e.detail;

        }

        if (direct < 0) {

            i +=speed;

        } else {

            i -=speed;

        }

        id.scrollLeft=i;

        //$("#out_div").stop().animate({scrollLeft:t},"slow");如果用jquery就在此做动画，滚动就不会生硬。

    }

    var id=document.getElementById("out_div");

    var speed=40;//调整速度

    if (document.addEventListener) {

        id.addEventListener('DOMMouseScroll', scrollFunc, false);//Firefox

    }

    id.onmousewheel = scrollFunc; //IE

</script>

经过IE8,ie6(添加width:99%就是因为IE6)，360，chrome,safari,傲游，firefox测试