js 页面无滚动条添加滚轮事件
2015-08-13 11:29
253 查看
当页面无滚动条时,滑动滚轮时window.onscroll事件不会相应,此时应该去添加滚轮事件
var MouseWheelHandler=function(e){
e.preventDefault();
e=window.event||e;
var value;
if(e.wheelDelta)
value=e.wheelDelta;
else if(e.detail)
value=-e.detail;
}
var addMouseWheelHandler=function(){
if(document.attachEvent)
document.attachEvent('onmousewheel',MouseWheelHandler);
else if(document.addEventListener)
document.addEventListener('DOMMouseScroll',MouseWheelHandler,false);
else
document.addEventListener('mousewheel',MouseWheelHandler,false);
}
addMouseWheelHandler();
在IE、chrome、opera、safari、firefox中已测试chrome、ie、Firefox可用,
其中要注意的是,Firefox中是通过e.detail来判断滚轮方向,且e.detail=-3方向向上,e.detail=3方向向下
IE、chrome中通过e.wheelDelta判断滚轮方向,e.wheelDelta=120方向向上,e.wheelDelta=-120方向向下
但是,当页面有滚动条时要注意,原始的滚轮事件会失效
var MouseWheelHandler=function(e){
e.preventDefault();
e=window.event||e;
var value;
if(e.wheelDelta)
value=e.wheelDelta;
else if(e.detail)
value=-e.detail;
}
var addMouseWheelHandler=function(){
if(document.attachEvent)
document.attachEvent('onmousewheel',MouseWheelHandler);
else if(document.addEventListener)
document.addEventListener('DOMMouseScroll',MouseWheelHandler,false);
else
document.addEventListener('mousewheel',MouseWheelHandler,false);
}
addMouseWheelHandler();
在IE、chrome、opera、safari、firefox中已测试chrome、ie、Firefox可用,
其中要注意的是,Firefox中是通过e.detail来判断滚轮方向,且e.detail=-3方向向上,e.detail=3方向向下
IE、chrome中通过e.wheelDelta判断滚轮方向,e.wheelDelta=120方向向上,e.wheelDelta=-120方向向下
但是,当页面有滚动条时要注意,原始的滚轮事件会失效
相关文章推荐
- JavaScript语言基础知识1
- JavaScript的面向对象编程基础
- JS使用userAgent判断操作系统和浏览器类型
- 深入详解javascript之delete操作符
- JQ、JS 自动给文本框的数字加千分位(带format-number插件)
- 用JS获取上传文件的真实路径 fakepath的问题
- JVM性能调优监控工具jps、jstack、jstat、jmap、jinfo使用详解
- BZOJ 1030 [JSOI2007]文本生成器
- javascript 模仿块级作用域
- JavaScript简单判断复选框是否选中及取出值的方法
- 关于js的replace
- 利用js实现table的无刷新静态内容过滤
- Javascript 遍历对象的属性
- JavaScript实现将文本框的值插入指定位置的方法
- jstl c标签 ”test does not support runtime expressions“
- JS 通过正则表达式获取URL中的参数
- js自执行函数
- js自执行函数
- javascript递归与闭包
- webx配置html转义构建JSONP跨域