js處理局部scroll事件禁止外部scroll滾動解決辦法，jquery.mousewheel.js處理時禁止辦法說明

js Code:

<script>
window.onload = function() {
    for (i = 0; i < 500; i++) {
        var x = document.createElement('div');
        x.innerHTML = "換行<br/>";
        document.body.appendChild(x);
    }
    function $(x) {
        return document.getElementById(x);
    };
    $("wrap").onmousewheel = function scrollWheel(e) {
        var sl;
        e = e || window.event;
        if (navigator.userAgent.toLowerCase().indexOf('msie') >= 0) {
            event.returnValue = false;
        } else {
            e.preventDefault();
        };
        if (e.wheelDelta) {
            sl = e.wheelDelta;
        } else if (e.detail) {
            sl = -e.detail;
        };
        if (sl < 0) {
            var x = parseInt($("he").innerHTML);
            x++;
            $("he").innerHTML = x;
        } else {
            var x = parseInt($("he").innerHTML);
            x--;
            $("he").innerHTML = x;
        };
    };
    if (navigator.userAgent.toLowerCase().indexOf('firefox') >= 0) {
        //firefox支援onmousewheel
        addEventListener('DOMMouseScroll',
        function(e) {
            var obj = e.target;
            var onmousewheel;
            while (obj) {
                onmousewheel = obj.getAttribute('onmousewheel') || obj.onmousewheel;
                if (onmousewheel) break;
                if (obj.tagName == 'BODY') break;
                obj = obj.parentNode;
            };
            if (onmousewheel) {
                if (e.preventDefault) e.preventDefault();
                    e.returnValue = false; //禁止頁面滾動
                    if (typeof obj.onmousewheel != 'function') {
                    //将onmousewheel轉換成function
                    eval('window._tmpFun = function(event){' + onmousewheel + '}');
                    obj.onmousewheel = window._tmpFun;
                    window._tmpFun = null;
                };
                // 不直接執行是因為若onmousewheel(e)運作時間較長的話，會導緻鎖定滾動失效，使用setTimeout可避免
                setTimeout(function() {
                    obj.onmousewheel(e);
                },1);
            };
        },
        false);
    };
}
</script>      

<div id="wrap" style="position:absolute;left:100px;top:0px;background:#ccc;width:300px;height:300px;">
<h1 id="he" style="text-align:center;width:100%;color:#f00;">0</h1>
滑鼠移動這裡，轉動滾輪，盡情的調戲吧！
滑鼠移出這裡，轉動滾輪，看看它的反應！
</div>      

jquery code:

前提：加載了jquery的mousewheel插件。

代碼如下：

$(function(){
    $('.timeline').mousewheel(function (event, delta) {
        if (delta > 0) {
            $(this).css('backgroundColor', 'red');
        } else {
            $(this).css('backgroundColor', 'blue'); 
        }
        return false; //return false即可
    });
})      

朝朝暮暮.