子元素scroll，滚动结束后不影响父元素滚动

window.onload=function(){
    var eventType="mousewheel";
    if(document.mozHidden){
        eventType="DOMMouseScroll";
    }
    document.getElementById('overflow').addEventListener(eventType,function(e){
        var event=window.e||e;
        var delta=event.wheelDelta?event.wheelDelta:-(event.detail);
        var scrollTop=this.scrollTop;
        var screenHeight=this.clientHeight;
        var scrollHeight=this.scrollHeight;
        console.log(scrollHeight);
        if(delta>0&&scrollTop<=0||delta<0&&scrollTop>=scrollHeight-screenHeight){
            this.scrollTop = delta > 0? 0: scrollHeight;
            if(event.preventDefault)
                event.preventDefault();
            else{
                event.returnValue=false
            }
        }
    },false)
}

html

posted @ 2017-01-22 23:33 莺哥阅读(864) 评论(0) 编辑收藏举报

会员力量，点亮园子希望

刷新页面返回顶部

犹记惊鸿照影（JS）

子元素scroll，滚动结束后不影响父元素滚动

公告