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 相关文章推荐
判断用户的在线状态 onbeforeunload事件
Mar 05 Javascript
DIV外区域Click后关闭DIV的实现代码
Dec 21 Javascript
浅谈JavaScript函数参数的可修改性问题
Dec 05 Javascript
JS实现的仿东京商城菜单、仿Win右键菜单及仿淘宝TAB特效合集
Sep 28 Javascript
利用jQuery中的ajax分页实现代码
Feb 25 Javascript
全面了解js中的script标签
Jul 04 Javascript
用javascript获取任意颜色的更亮或更暗颜色值示例代码
Jul 21 Javascript
layui自定义工具栏的方法
Sep 19 Javascript
layui写后台表格思路和赋值用法详解
Nov 14 Javascript
JavaScript, select标签元素左右移动功能实现
May 14 Javascript
vue3 watch和watchEffect的使用以及有哪些区别
Jan 26 Vue.js
JavaScript组合继承详解
Nov 07 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
PHP 递归效率分析
2009/11/24 PHP
PHP中for与foreach的区别分析
2011/03/09 PHP
很让人受教的 提高php代码质量36计
2012/09/05 PHP
php实现HTML实体编号与非ASCII字符串相互转换类实例
2016/11/02 PHP
PHP排序算法之基数排序(Radix Sort)实例详解
2018/04/21 PHP
地址栏传递中文参数乱码在js里用escape转码
2013/08/28 Javascript
Javascript delete 引用类型对象
2013/11/01 Javascript
php和js对数据库图片进行等比缩放示例
2014/04/28 Javascript
JavaScript设计模式之工厂模式和构造器模式
2015/02/11 Javascript
JavaScript实现的encode64加密算法实例分析
2015/04/15 Javascript
js为什么不能正确处理小数运算?
2015/12/29 Javascript
微信小程序动态的加载数据实例代码
2017/04/14 Javascript
Vue+axios 实现http拦截及路由拦截实例
2017/04/25 Javascript
JS实现根据数组对象的某一属性排序操作示例
2019/01/14 Javascript
JS通过ajax + 多列布局 + 自动加载实现瀑布流效果
2019/05/30 Javascript
js找出5个数中最大的一个数和倒数第二大的数实现方法示例小结
2020/03/04 Javascript
vue前端和Django后端如何查询一定时间段内的数据
2021/02/28 Vue.js
python发送arp欺骗攻击代码分析
2014/01/16 Python
利用python打印出菱形、三角形以及矩形的方法实例
2017/08/08 Python
http请求 request失败自动重新尝试代码示例
2018/01/25 Python
python实现植物大战僵尸游戏实例代码
2019/06/10 Python
python中的句柄操作的方法示例
2019/06/20 Python
通过实例了解Python str()和repr()的区别
2020/01/17 Python
python标准库sys和OS的函数使用方法与实例详解
2020/02/12 Python
Python3实现打印任意宽度的菱形代码
2020/04/12 Python
jupyternotebook 撤销删除的操作方式
2020/04/17 Python
Python dict的常用方法示例代码
2020/06/23 Python
python3实现语音转文字(语音识别)和文字转语音(语音合成)
2020/10/14 Python
AmazeUI 面板的实现示例
2020/08/17 HTML / CSS
介绍一下Transact-SQL中SPACE函数的用法
2015/09/01 面试题
会计找工作求职信范文
2013/12/09 职场文书
会计岗位职责范本
2014/03/07 职场文书
双语教学实施方案
2014/03/23 职场文书
幼儿园学前班幼儿评语
2014/12/29 职场文书
CSS 实现Chrome标签栏的技巧
2021/08/04 HTML / CSS
java如何实现获取客户端ip地址的示例代码
2022/04/07 Java/Android