JS 鼠标滚轮事件（mousewheel/DOMMouseScroll）
onmousewheel （FireFox不支持此事件）
// IE/Opera/Chrome/Safari
document.body.onmousewheel = function(event) {
event = event || window.event;
console.dir(event);
};
DOMMouseScroll（FireFox独有事件）
// Firefox
document.body.addEventListener("DOMMouseScroll", function(event) {
console.dir(event);
});
js返回数值判断滚轮上下
- Firefox 使用detail，只取 ±3．
- 五大浏览器（IE、Opera、Safari、Firefox、Chrome）使用wheelDelta，只取 ±120．
- 其中正数表示为向上，负数表示向下．
Example
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Test wheel event</title>
</head>
<body style="height:2000px;">
<script type="text/javascript">
var scrollFunc = function(event){
event = event || window.event;
if(event.wheelDelta){ // IE/Opera/Chrome/Safari
t1 = event.wheelDelta;
console.log(t1);
}else if(event.detail){ // Firefox
t2 = event.detail;
console.log(t2);
}
}
/*注册事件*/
if(document.addEventListener){
// firefox
document.body.addEventListener("DOMMouseScroll",scrollFunc,false);
}
document.body.onmousewheel = scrollFunc; // IE/Opera/Chrome/Safari
</script>
</body>
</html>
JS 鼠标滚轮事件（mousewheel/DOMMouseScroll）的更多相关文章
- 学习 JS滚轮事件(mousewheel/DOMMouseScroll)
学习 JS滚轮事件(mousewheel/DOMMouseScroll) 1-1 滚轮事件兼容性的差异 IE,chrome,safari 浏览器都使用 onmousewheel, 只有firefo ...
- JS滚轮事件(mousewheel/DOMMouseScroll)了解
已经没有了小学生时代过目不忘的记忆力了,很多自己折腾的东西.接触的东西,短短1年之后就全然不记得了.比方说,完全记不得获取元素与页面距离的方法(getBoundingClientRect),或者是不记 ...
- 鼠标滚轮事件MouseWheel
其实在大多数浏览器(IE6, IE7, IE8, Opera 10+, Safari 5+,Chrome)中,都提供了 "mousewheel" 事件.但杯具的是 Firefox ...
- JS鼠标滚轮事件详解
鼠标滚轮事件 //兼容性写法,该函数也是网上别人写的,不过找不到出处了,蛮好的,所有我也没有必要修改了 //判断鼠标滚轮滚动方向 if (window.addEventListener)//FF,火狐 ...
- js鼠标滚轮事件兼容
JavaScript鼠标滚轮事件 IE6.0首先实现了鼠标的滚轮事件,其良好的交互效果得到认可,随后Opera.chrome.safari等主流浏览器都实现了该效果,不过存在着很大的兼容问题. 大多数 ...
- JS鼠标滚轮事件解析
一.不同浏览器的鼠标滚轮事件 首先,不同的浏览器有不同的滚轮事件.主要是有两种,onmousewheel(IE/Opera/Chrome支持,firefox不支持)和DOMMouseScroll(只有 ...
- js鼠标滚轮事件
不多说,直接上代码. //非ie document.body.onmousewheel = function(event) { event = event || window.event; conso ...
- js鼠标滚轮事件上滚下滚判断
onmousewheel <script> var scrollFunc = function (e){ //其实我一开始也不知道用啥 //console.log(e)我们可以打印一下 / ...
- js中鼠标滚轮事件详解
js中鼠标滚轮事件详解 (以下内容部分内容参考了http://adomas.org/javascript-mouse-wheel/ ) 之前js 仿Photoshop鼠标滚轮控制输入框取值中已使用 ...
随机推荐
- java-int类型：int默认为0导致更新操作未赋值的情况下将值更新为0
日常开发中,做更新操作的时候的处理方法为:当这个字段有值则更新,没有值就不更新,在mybatis的xml中表现为: <!-- 修改记录,只修改只不为空的字段 --> <update ...
- 总结-Hibernate
JPA 全称 Java Persistence API @Entity @Table(name = "user") public class User { @Id @Generat ...
- mysql_索引原理及优化
思考: 我们知道mysql最好的数据存储量级是百万级别,是的往往在百万级别或者几十万级别就会出现慢查询(我对慢查询的定义是大于1秒),几年前我所在的一个做pos机支付的联机交易的核心系统组,当时就做过 ...
- [skill] C++ delete VS delete []
delete 用来删除 new 返回的对象. 先调用对象的析构,然后释放指针指向的内存. delete[] 用来删除 new [] 返回的对象. 先调用数组中每一个对象的析构,然后释放指针指向的内存.
- js获取cookie 和 模仿php的&_GET方法
//获取get参数 function _get(name){ var reg = new RegExp("(^|&)"+ name +"=([^&]*)( ...
- Yii2 关闭和打开csrf 验证 防止表单多次重复提交
原文地址:http://blog.csdn.net/terry_water/article/details/52221007 1.在Yii2配置中配置所有:所有的controller都将关闭csrf验 ...
- Dreamweaver的代码与设计简单结合的运用
首先在设计里面写好自己需要的内容,在文字设置中,选中要设置的文字,然后点击属性栏的css,把目标规则改为新内联样式,然后在改变字体的大小颜色样式,然后在代码里面根据需要再修改: 图片插入是在菜单栏点击 ...
- LintCode Longest Common Substring
原题链接在这里:http://www.lintcode.com/en/problem/longest-common-substring/# 题目: Given two strings, find th ...
- MyBatis操作指南-配置使用Provider动态生成SQL
- ios开发证书
文章写得很透彻 https://segmentfault.com/a/1190000004144556?f=tt&hmsr=toutiao.io