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鼠标滚轮控制输入框取值中已使用 ...
随机推荐
- 使用数据泵+dblink迁移数据库，适用于本地空间不足的情况
col name for a40 select name,locks,pins from v$db_object_cache where locks > 0 and pins > 0 an ...
- mysql慢查询日志分析工具mysqldumpslow
一.mysqldumpslow为mysql自带,安装后既带有该工具. 二.mysqldumpslow经常使用的参数 -s,是order的顺序 al 平均锁定时间 ar 平均返回记录时间 at 平均查询 ...
- Thinking in Java——笔记(13)
Strings Immutable Strings Objects of the String class are immutable. Every method in the class that ...
- CACHE COHERENCE AND THE MESI PROTOCOL
COMPUTER ORGANIZATION AND ARCHITECTURE DESIGNING FOR PERFORMANCE NINTH EDITION In contemporary multi ...
- [bzoj1087][scoi2005]互不侵犯king
题目大意 在N×N的棋盘里面放K个国王,使他们互不攻击,共有多少种摆放方案.国王能攻击到它上下左右,以及左上 左下右上右下八个方向上附近的各一个格子,共8个格子. 思路 首先,搜索可以放弃,因为这是一 ...
- adv钓鱼题
4 10 4 5 6 2 10 2 10 4 5 6 2 10 2 60 1 20 29 20 50 20 60 1 20 20 20 60 20 #include<iostream> u ...
- iOS真机测试,为Provisioning添加设备 -- based xcode6［原］
iOS真机测试, 我们需要添加几台新的设备进行测试.我们只需要对Provisioning Profiles 进行更新. 1. 在苹果开发者中心添加测试设备 打开苹果Certificates, Ide ...
- iOS开发UI篇—iPad和iPhone开发的比较
一.iPad简介 1.什么是iPad 一款苹果公司于2010年发布的平板电脑 定位介于苹果的智能手机iPhone和笔记本电脑产品之间 跟iPhone一样,搭载的是iOS操作系统 2.iPad的市场情况 ...
- C语言 ---- 指针 iOS学习-----细碎知识点总结
内存的访问形式:1.直接访问:通过变量名进行访问.2.间接访问:先找到变量存放的地址,然后根据地址去访问对应的内存空间. 指针--- // 定义一个整形指针变量,用来存储num1在内存中的地址 ...
- swift：谈谈swift几种常见属性的区别
一.前奏 Swift作为一门新语言,经过几年的发展,逐渐趋于完善,目前已经更新到3.0版本,它汇集许多其他语言的特点,例如JS.Paython.C++等,完全区别于OC.个人感觉它没有完全的OOP和O ...