码迷,mamicode.com
首页 > 其他好文 > 详细

【事件】滚轮事件(DOM0级),向上 || 向下 ||滚动

时间:2016-08-14 22:08:01      阅读:143      评论:0      收藏:0      [点我收藏+]

标签:

//滚轮事件(DOM0级)
$.fn.mouseScroll = function(obj) {
    if (obj) {
        var defaults = {
            up: $.noop, //向上滚动时
            down: $.noop, //向下滚动时
            wheel: $.noop, //滚动时
            time: 700, //时间间隔(防止多次触发)
            isPropagate: true //是否传播
        };
        var param = $.extend(defaults, obj);
        var isRun = true;
        var fMousewheel = function(event) {
            var e = event || window.event;
            if (!param.isPropagate) {
                if (e.stopPropagation) e.stopPropagation();
                else e.cancelBubble = true;
            }
            if (isRun) {
                isRun = false;
                setTimeout(function() {
                    isRun = true;
                }, param.time);
                if (e.wheelDelta) {
                    if (e.wheelDelta < 0) param.down(e);
                    else param.up(e);
                } else if (e.detail) {
                    if (e.detail > 0) param.down(e);
                    else param.up(e);
                }
                param.wheel(e);
            }
        };
        this.each(function() {
            if (this.addEventListener) { //firefox
                this.addEventListener(‘DOMMouseScroll‘, fMousewheel, false);
            }
            this.onmousewheel = fMousewheel; //IE、chrome
        });
    }
    return this;
};



//使用情况
$(‘#xxx‘).mouseScroll({
    up: function(e) {
        console.log(‘up‘);
    },
    down: function(e) {
        console.log(‘down‘);
    },
    wheel: function(e) {
        console.log(‘wheel‘);
    },
    time: 700,
    isPropagate: true
});

 

【事件】滚轮事件(DOM0级),向上 || 向下 ||滚动

标签:

原文地址:http://www.cnblogs.com/af-art/p/5771040.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!