之前看到一個網頁，有滑鼠滾輪滾動時實作了橫向的滾動效果，覺得有意思，就試了試，本來想挺簡單的一個功能，但是相容各浏覽器就要費些功夫了
HTML和CSS代碼
img{
height:200px;
}
#scrollDiv{
display: inline-block;
float: left;
overflow-x: auto;
white-space:nowrap;
}
js代碼
在chrome 中 設定 document.documentElement.scrollLeft 都會為0，但是可以設定 document.body.scrollLeft,是以 需要進行浏覽器判斷，同時在FireFox下，沒有mousewheel事件，但是FireFox增加了DOMMouseScroll事件；
var scrollDiv = document.getElementById("scrollDiv");
var element = document.documentElement;
if(navigator.userAgent.indexOf("Chrome")>0){
element = document.body;
}
document.addEventListener('DOMMouseScroll',handler,false)
document.addEventListener('mousewheel',handler,false)
function handler(event){
var detail = event.wheelDelta || event.detail;
var moveForwardStep = 1;
var moveBackStep = -1;
var step = 0;
if(detail > 0){
step = moveForwardStep*100;
}else{
step = moveBackStep * 100;
}
element.scrollLeft += step;
}
document.body 和 document.documentElement的差別
document.body 是DOM對象裡的body子節點，即
标簽；
document.documentElement 是整個節點樹的根節點root，即 标簽；