Jquery增加鼠标中间功能mousewheel的实例代码


Posted in Javascript onSeptember 05, 2013
(function ($) {
    var types = ['DOMMouseScroll', 'mousewheel'];
    $.event.special.mousewheel = {
        setup: function () {
            if (this.addEventListener) {
                for (var i = types.length; i;) {
                    this.addEventListener(types[--i], handler, false);
                }
            } else {
                this.onmousewheel = handler;
            }
        },
        teardown: function () {
            if (this.removeEventListener) {
                for (var i = types.length; i;) {
                    this.removeEventListener(types[--i], handler, false);
                }
            } else {
                this.onmousewheel = null;
            }
        }
    };
    $.fn.extend({
        mousewheel: function (fn) {
            return fn ? this.bind("mousewheel", fn) : this.trigger("mousewheel");
        },
        unmousewheel: function (fn) {
            return this.unbind("mousewheel", fn);
        }
    });
    function handler(event) {
        var orgEvent = event || window.event, args = [].slice.call(arguments, 1), delta = 0, returnValue = true, deltaX = 0, deltaY = 0;
        event = $.event.fix(orgEvent);
        event.type = "mousewheel";
        // Old school scrollwheel delta
        if (event.originalEvent.wheelDelta) { delta = event.originalEvent.wheelDelta / 120; }
        if (event.originalEvent.detail) { delta = -event.originalEvent.detail / 3; }
        // New school multidimensional scroll (touchpads) deltas
        deltaY = delta;
        // Gecko
        if (orgEvent.axis !== undefined && orgEvent.axis === orgEvent.HORIZONTAL_AXIS) {
            deltaY = 0;
            deltaX = -1 * delta;
        }
        // Webkit
        if (orgEvent.wheelDeltaY !== undefined) { deltaY = orgEvent.wheelDeltaY / 120; }
        if (orgEvent.wheelDeltaX !== undefined) { deltaX = -1 * orgEvent.wheelDeltaX / 120; }
        // Add event and delta to the front of the arguments
        args.unshift(event, delta, deltaX, deltaY);
        return $.event.handle.apply(this, args);
    }
})(jQuery);
调用:
$(document).mousewheel(function (e, detail) {
}
Javascript 相关文章推荐
jquery基础教程之数组使用详解
Mar 10 Javascript
ExtJS4 表格的嵌套 rowExpander应用
May 02 Javascript
HTML5 JS压缩图片并获取图片BASE64编码上传
Nov 16 Javascript
jQuery排序插件tableSorter使用方法
Feb 10 Javascript
使用ionic在首页新闻中应用到的跑马灯效果的实现方法
Feb 13 Javascript
Three.js获取鼠标点击的三维坐标示例代码
Mar 24 Javascript
JavaScript中undefined和null的区别
May 03 Javascript
详解React-Native解决键盘遮挡问题(Keyboard遮挡问题)
Jul 13 Javascript
node.js用fs.rename强制重命名或移动文件夹的方法
Dec 27 Javascript
Node.JS在命令行中检查Chrome浏览器是否安装并打开指定网址
May 21 Javascript
微信小程序监听用户登录事件的实现方法
Nov 11 Javascript
antd日期选择器禁止选择当天之前的时间操作
Oct 29 Javascript
jQuery关于导航条背景切换效果实现示例
Sep 04 #Javascript
JS控制阿拉伯数字转为中文大写示例代码
Sep 04 #Javascript
JS如何将UTC格式时间转本地格式
Sep 04 #Javascript
js 窗口抖动示例
Sep 04 #Javascript
js格式化货币数据实现代码
Sep 04 #Javascript
jQuery父级以及同级元素查找介绍
Sep 04 #Javascript
jquery 添加节点的几种方法介绍
Sep 04 #Javascript
You might like
磨咖啡豆的密诀
2021/03/03 冲泡冲煮
在PHP中利用XML技术构造远程服务(下)
2006/10/09 PHP
探讨:如何通过stats命令分析Memcached的内部状态
2013/06/14 PHP
PHP生成迅雷、快车、旋风等软件的下载链接代码实例
2014/05/12 PHP
php简单复制文件的方法
2016/05/09 PHP
JSON两种结构之对象和数组的理解
2016/07/19 PHP
PHP编程中的Session阻塞问题与解决方法分析
2017/08/07 PHP
最新优化收藏到网摘代码(digg,diigo)
2007/02/07 Javascript
JavaScript 入门·JavaScript 具有全范围的运算符
2007/10/01 Javascript
javascript 表格内容排序 简单操作示例代码
2014/01/03 Javascript
js检测网络是否具体连接功能的代码
2014/05/23 Javascript
js获取页面传来参数的方法
2014/09/06 Javascript
JS实现点击按钮自动增加一个单元格的方法
2015/03/09 Javascript
JS控制静态页面之间传递参数获取参数并应用的简单实例
2016/08/10 Javascript
详解AngularJS ui-sref的简单使用
2017/04/24 Javascript
Webstorm2016使用技巧(SVN插件使用)
2018/10/29 Javascript
vue实现可视化可拖放的自定义表单的示例代码
2019/03/20 Javascript
把大数据数字口语化(python与js)两种实现
2013/02/21 Python
python使用win32com在百度空间插入html元素示例
2014/02/20 Python
Python程序中用csv模块来操作csv文件的基本使用教程
2016/03/03 Python
Python 爬虫学习笔记之单线程爬虫
2016/09/21 Python
python中异常捕获方法详解
2017/03/03 Python
浅析python递归函数和河内塔问题
2017/04/18 Python
根据DataFrame某一列的值来选择具体的某一行方法
2018/07/03 Python
python二维键值数组生成转json的例子
2019/12/06 Python
ProBikeKit德国:在线公路自行车专家
2018/06/03 全球购物
JRE、JDK、JVM之间的关系怎样
2012/05/16 面试题
汽车专业毕业生自荐信
2013/11/03 职场文书
质监局领导班子践行群众路线整改方案
2014/10/26 职场文书
2014年纪委工作总结
2014/12/05 职场文书
好好学习保证书
2015/02/26 职场文书
2016庆祝教师节新闻稿
2015/11/25 职场文书
为什么说餐饮很难做,是因为你不了解这些新规则
2019/08/20 职场文书
Python 如何实现文件自动去重
2021/06/02 Python
Win11怎么添加用户?Win11添加用户账户的方法
2022/07/15 数码科技
CentOS7设置ssh服务以及端口修改方式
2022/12/24 Servers