js滚轮事件兼容写法
/**
* 简易的事件添加方法
*/ define(function(require, exports, module) {
exports.addEvent = (function(window, undefined) {
var _eventCompat = function(event) {
var type = event.type;
if (type == 'DOMMouseScroll' || type == 'mousewheel') {
event.delta = (event.wheelDelta) ? event.wheelDelta / 120 : -(event.detail || 0) / 3;
}
//alert(event.delta);
if (event.srcElement && !event.target) {
event.target = event.srcElement;
}
if (!event.preventDefault && event.returnValue !== undefined) {
event.preventDefault = function() {
event.returnValue = false;
};
}
/*
......其他一些兼容性处理 */
return event;
};
if (window.addEventListener) {
return function(el, type, fn, capture) {
if (type === "mousewheel" && document.mozFullScreen !== undefined) {
type = "DOMMouseScroll";
}
el.addEventListener(type, function(event) {
fn.call(this, _eventCompat(event));
}, capture || false);
}
} else if (window.attachEvent) {
return function(el, type, fn, capture) {
el.attachEvent("on" + type, function(event) {
event = event || window.event;
fn.call(el, _eventCompat(event));
});
}
}
return function() {};
})(window);
});
于是,我们就可以很从容使用mousewheel事件了。例如:
addEvent(dom, "mousewheel", function(event) {
if (event.delta < 0) { alert("鼠标向上滚了!"); }
});
js滚轮事件兼容写法的更多相关文章
- 学习 JS滚轮事件(mousewheel/DOMMouseScroll)
学习 JS滚轮事件(mousewheel/DOMMouseScroll) 1-1 滚轮事件兼容性的差异 IE,chrome,safari 浏览器都使用 onmousewheel, 只有firefo ...
- js event 事件兼容浏览器 ie不需要 event参数 firefox 需要
js event 事件兼容浏览器 ie不需要 event参数 firefox 需要 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 ...
- js鼠标滚轮事件兼容
JavaScript鼠标滚轮事件 IE6.0首先实现了鼠标的滚轮事件,其良好的交互效果得到认可,随后Opera.chrome.safari等主流浏览器都实现了该效果,不过存在着很大的兼容问题. 大多数 ...
- JS滚轮事件(mousewheel/DOMMouseScroll)了解
已经没有了小学生时代过目不忘的记忆力了,很多自己折腾的东西.接触的东西,短短1年之后就全然不记得了.比方说,完全记不得获取元素与页面距离的方法(getBoundingClientRect),或者是不记 ...
- js 滚轮事件 滚轮焦点图(轮播图)
利用滚轮,切换轮播图.附带mousewheel插件以及原生js写法: <!doctype html> <html> <head> <meta charse ...
- JS滚轮事件onmousewheel
典型的应用时鼠标滚轮滚动控制图片或者文字的大小,例如此类的转动鼠标滚轮实现缩放等等交互效果中,会用到 Mousewheel 事件.在大多数浏览器(IE6, IE7, IE8, Opera 10+, S ...
- js滚轮事件
首先,不同的浏览器有不同的滚轮事件.主要是有两种,onmousewheel(firefox不支持)和DOMMouseScroll(只有firefox支持).w3c文档已经废弃了onmousewheel ...
- js滚轮事件需要注意的兼容性问题
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 浏览器 onbeforeunload 事件 兼容写法
window.onbeforeunload = onbeforeunload_handler; function onbeforeunload_handler() { var warning = &q ...
随机推荐
- Java面试题及解析
面试题 解析 1 2 3 Join Sleep-线程睡眠 Yiedld-线程让步 sleep与yield方法区别 isAlive 终止线程 面试题 1.下列单词属于java访问修饰符的有(A,B, C ...
- 一条sql查出数据库某张表的所有属性
select t.TABLE_NAME,--表名 t.COLUMN_NAME,--字段名 t.DATA_TYPE,--字段属性 t.DATA_LENGTH,--类型长度 t.DATA_PRECISIO ...
- Thank in Java
Think in Java 2.一切都是对象 2.1 引用操作对象 Java 中一切都是对象,因此可以采用单一固定得语法. 操作对象得标识符实际上是对对象得一个 "引用"refer ...
- Java链表(英雄增删查改)
链表(Linked List)介绍 链表是有序的列表,但是它在内存中是存储如下 小结: 1.链表是以节点的方式来存储,是链式存储. 2.每个节点包含 data 域, next 域:指向下一个节点. 3 ...
- PHP基础之与MySQL那些事
前言 这篇文章会对PHP的MySQL扩展库,MySQLI的扩展库,SQL批量执行,事务控制等等进行一些简单的讲解. MySQL扩展 PHP中MySQL扩展,虽然因为安全的原因,在PHP5.6及往上不在 ...
- 2019牛客多校 Round8
Solved:3 Rank:261 E Explorer (线段树) 题意:n个点 m条边 每条边只有身高l,r内的人可以穿过 问有几种身高可以从1走到n 题解:把l,r离散化后(左闭右开) 线段树叶 ...
- hdu 6827 Road To The 3rd Building
题意: t组输入,每一组一个n,然后后面是n个树的值(我们放到数组v里面),你需要从[1,n]这个区间内挑选出来两个数i,j,你需要保证i<=j,之后你要求一下v[i]+v[i+1]+...+v ...
- AtCoder Beginner Contest 182 D - Wandering (前缀和)
题意:在\(x\)轴上,你刚开始在\(0\)的位置,第\(i\)次操作需要走\(A_1,...,A_i\)个单位,如果\(A_i\)为正向右走,否则向左走,求你所能走到的最大坐标. 题解:我们一步一步 ...
- [HDU-5172] 单点查询线段树
题意: 给你一个长度为n的数组v[],有m次询问,问你在区间[L,R]中是否包含区间[1,R-L+1]的全部数字,如果是输出YES,否则输出NO 题解: 区间[1,R-L+1]与区间[L,R]的长度一 ...
- 洛谷-P1439 【模板】最长公共子序列 (DP,离散化)
题意:给两个长度为\(n\)的全排列,求他们的LCS 题解:这题给的数据范围到\(10^5\),用\(O(n^2)\)的LCS模板过不了,但由于给的是两个全排列,他们所含的元素都是一样的,所以,我们以 ...