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 相关文章推荐
json跟xml的对比分析
Jun 10 Javascript
网站页面自动跳转实现方法PHP、JSP(下)
Aug 01 Javascript
Jquery中对数组的操作代码
Aug 12 Javascript
利用js(jquery)操作Cookie的方法说明
Dec 19 Javascript
ParseInt函数参数设置介绍
Jan 02 Javascript
JS比较2个日期间隔的示例代码
Apr 15 Javascript
Javascript的setTimeout()使用闭包特性时需要注意的问题
Sep 23 Javascript
jquery.multiselect多选下拉框实现代码
Nov 11 Javascript
layer实现弹窗提交信息
Dec 12 Javascript
JS批量替换内容中关键词为超链接
Feb 20 Javascript
vue+webpack实现异步加载三种用法示例详解
Apr 24 Javascript
vue实现微信获取用户信息的方法
Mar 21 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
什么是MVC,好东西啊
2007/05/03 PHP
PHP中使用gettext来支持多语言的方法
2011/05/02 PHP
PHP查询MySQL大量数据的时候内存占用分析
2011/07/22 PHP
php语言注释,单行注释和多行注释
2018/01/21 PHP
php 获取xml接口数据的处理方法
2018/05/31 PHP
jQuery 中$(this).index与$.each的使用指南
2014/11/20 Javascript
浅析jQuery EasyUI中的tree使用指南
2014/12/18 Javascript
基于jQuery实现的仿百度首页滑动选项卡效果代码
2015/11/16 Javascript
利用Javascript仿Excel的数据透视分析功能
2016/09/07 Javascript
微信小程序 引用其他js文件实现代码
2017/02/22 Javascript
Node.js中你不可不精的Stream(流)
2018/06/08 Javascript
原生js实现分页效果
2020/09/23 Javascript
[01:14]DOTA2 7.22版本新增神杖效果展示(智力英雄篇)
2019/05/29 DOTA
使用基于Python的Tornado框架的HTTP客户端的教程
2015/04/24 Python
Python中的字符串替换操作示例
2016/06/27 Python
Eclipse和PyDev搭建完美Python开发环境教程(Windows篇)
2016/11/16 Python
对python中return和print的一些理解
2017/08/18 Python
python中requests使用代理proxies方法介绍
2017/10/25 Python
Python reduce()函数的用法小结
2017/11/15 Python
使用pygame模块编写贪吃蛇的实例讲解
2018/02/05 Python
Python3.x爬虫下载网页图片的实例讲解
2018/05/22 Python
python进行两个表格对比的方法
2018/06/27 Python
深入解析python中的实例方法、类方法和静态方法
2019/03/11 Python
python文件操作的简单方法总结
2019/11/07 Python
简单了解如何封装自己的Python包
2020/07/08 Python
用CSS3来实现社交分享按钮
2014/11/11 HTML / CSS
html5视频自动横过来自适应页面且点击播放功能的实现
2020/06/03 HTML / CSS
世界上最受欢迎的花店:1-800-Flowers.com
2020/06/01 全球购物
高级Java程序员面试题
2016/06/23 面试题
行政部主管岗位职责
2013/12/28 职场文书
房产授权委托书范本
2014/09/22 职场文书
大学生团员个人总结
2015/02/14 职场文书
幼儿园推普周活动总结
2015/05/07 职场文书
世界名著读书笔记
2015/06/25 职场文书
标准版个人借条怎么写?以及什么是借条?
2019/08/28 职场文书