FF使用DOMMouseScroll,其他浏览器使用mousewheel

FF在一个特殊的属性event.detail。表示滚动的值

event.detail
正数:向下滚动,负数:向上滚动
滚动一次值3,向上滚动一页值为-32768,向下滚动一页值为+32768。其它值代表滚动的行数, 方向代表了数值的正负号
受信任的事件是不会给detail赋值0

其它浏览器,通过event.wheelDelta获取滚动值
正数:向上滚动。负数:向下滚动
滚动一次值120

  1. //非FF
  2. //event.wheelDelta
  3. // 正数:向上滚动。负数:向下滚动
  4. // 滚动一次值120
  5. document.body.onmousewheel = function (event) {
  6. event = event || window.event;
  7. log('onmousewheel');
  8. log(event);
  9. log('event.detail=' + event.detail);//0
  10. log('event.wheelDelta=' + event.wheelDelta);
  11. };
  12. //FF
  13. // event.detail
  14. // 正数:向下滚动。负数:向上滚动
  15. // 向上滚动一页值为-32768,向下滚动一页值为+32768,其它值代表滚动的行数, 方向代表了数值的正负号
  16. // 受信任的事件是不会给detail赋值0
  17. document.body.addEventListener("DOMMouseScroll", function (event) {
  18. log('DOMMouseScroll');
  19. log(event);
  20. log(event.detail);
  21. });
  22. function log(arg) {
  23. window.console && window.console.log(arg);
  24. }

版权声明:本文博客原创文章,博客,未经同意,不得转载。

mousewheel 与 DOMMouseScroll的更多相关文章

  1. 鼠标滚轮(mousewheel)和DOMMouseScroll事件

    IE6.0首先实现了mousewheel事件.此后,Opera.Chrome和Safari也都实现了这个事件.当用户通过鼠标滚轮与页面交互.在垂直方向上滚动页面时(无论向下还是向上),就会触发mous ...

  2. javascript事件之鼠标滚轮(mousewheel)和DOMMouseScroll事件

    javascript事件之鼠标滚轮(mousewheel)和DOMMouseScroll事件 发布时间:2015-02-07   编辑:www.jquerycn.cn 本文学习下,javascript ...

  3. 鼠标滚轮事件MouseWheel

    其实在大多数浏览器(IE6, IE7, IE8, Opera 10+, Safari 5+,Chrome)中,都提供了 "mousewheel" 事件.但杯具的是 Firefox ...

  4. 关于jQuery中实现放大镜效果

    1.1.1 摘要 相信大家都见过或使用过放大镜效果,甚至实现过该效果,它一般应用于放大查看商品图片,一些电商网站(例如:凡客,京东商城,阿里巴巴等)都有类似的图片查看效果. 在接下来的博文中,我们将向 ...

  5. jQuery实现放大镜效果

    1.1.1 摘要 相信大家都见过或使用过放大镜效果,甚至实现过该效果,它一般应用于放大查看商品图片,一些电商网站(例如:凡客,京东商城,阿里巴巴等)都有类似的图片查看效果. 在接下来的博文中,我们将向 ...

  6. JavaScript事件---事件绑定和深入

    发文不易,转载传播,请亲注明链接出处,谢谢! 内容提纲: 1.传统事件绑定的问题 2.W3C事件处理函数 3.IE事件处理函数 4.事件对象的其他内容 事件绑定分为两种:一种是传统事件绑定(内联模型, ...

  7. 第二十二课:js事件原理以及addEvent.js的详解

    再看这篇博客之前,希望你已经对js高级程序编程一书中的事件模块进行了详读,不然我只能呵呵了. document.createEventObject,在IE下创建事件对象event. elem.fire ...

  8. JavaScript判断鼠标滑轮是向下还是向上滚动

    我们常用的就是鼠标,鼠标中键一般都用于滑动网页,但是网页中很多很炫的效果,使用鼠标滑轮操作更好. 当然对于手机就没有这个设备了,所以就不用考虑手机端的实现方法,手机端有触摸滑动事件. 使用JavaSc ...

  9. JavaScript的事件绑定及深入

     事件绑定分为两种:一种是传统事件绑定(内联模型,脚本模型),一种是现代事件绑定 (DOM2 级模型).现代事件绑定在传统绑定上提供了更强大更方便的功能. 一.传统事件绑定的问题传统事件绑定有内联模型 ...

随机推荐

  1. 两个实验操作系统-ubuntu在安装配置pintos

    安前两次莫名其妙, 蛋疼的实验操作系统.. 首先下错了总结第一次. 使用最后gdb调试pintos什么时候, 这个错误将被报告: bochsrc.txt:8: Bochs is not compile ...

  2. 发展合作-ASP.Net传递页面之间的值

    在合作开发中,在页面串传值的时候,遇到了一些困难.在网上搜罗了一下,发现好多的传值方式,能够简单地分下面三种. 一. URL传值 原页面的值放到目标页面的URL中.然后通过QueryString方法获 ...

  3. Unity入门

    Unity入门 用unity做一个最简单的交互.(相当于Hello World)仅仅要最后能执行就算入门了. 第一步,要先用三维制作软件制作出我们须要的场景. 这儿使用的是Max2012(软件大小3. ...

  4. 协同编辑多人word一个小技巧文件

    协同编辑多人word窍门 近期在工作中编写标书时因为不同内容分给了各个部门去制作.可是在汇总后遇到再次改动的问题.对方把改动后的部分文档发给我粘贴到标书中后,所有的格式所有都乱了.又一次整理格式.标题 ...

  5. Android规范发展

    一.Android 编码规范 1.java 代码中不出现中文.最多凝视中能够出现中文 2.局部变量命名.静态成员变量命名 仅仅能包括字母,单词首字母出第一个外,都为大写,其它字母都为小写 3.常量命名 ...

  6. 浏览器被劫持到http://hao.169x.cn/?v=108的解决办法

    不管什么浏览器打开都是 http://hao.169x.cn/?v=108 ​1.下载wmi tool,(微软官网下载,我的下载地址是: http://120.52.73.52/download.mi ...

  7. Swift语言教程中文文档

    Swift语言教程中文文档 Swift语言教程(一)基础数据类型 Swift语言教程(二)基础数据类型 Swift语言教程(三)集合类型 Swift语言教程(四) 集合类型 Swift语言教程(五)控 ...

  8. Word,Excel,pdf,txt等文件上传并提取内容

    近期项目需求:1.要用到各种文件上传,下载. 2.并对文件进行搜索. 3.仅仅要文件里包括有搜索的内容,所有显示出来. 今天正好有时间整理一下,方便以后阅读,及对须要用到的朋友提供微薄之力.首先在实现 ...

  9. zerglurker的c语言教程006——第一功能

    行,以往的经验教训后,.成员main性能.变数.命名等基本概念应该有一个初步的了解 下面,我们就可以开始我们自己的第一个定义的函数. 仿照头等舱.操作的第二个教训.添加一个新的项目的解决方案Lessi ...

  10. 《图书管理系统——java》

    /* (程序头部凝视開始) * 程序的版权和版本号声明部分 * Copyright (c) 2011, 烟台大学计算机学院学生 * All rights reserved. * 文件名:    < ...