在JS编程当中常常会用到鼠标滚轮事宜,然则要完成这个结果不能不斟酌兼容状况
存在的兼容性问题:
- 事宜对象兼容,IE是window.event,而FF只需要传个参数(event)就行
- 滚轮事宜:IE/Chrome 运用onmousewheel,而FF就标新立异,运用DOMMouseScroll
- 猎取滚轮的值:IE/Chrome运用onmousewheel的事宜对象event的wheelDelta,而FF采纳的是detail
- IE/Chrome向上转动为120,向下转动为-120;FF向上转动为-3,向下转动为3
贴码:
var oDelta=document.getElementById('Delta');
var num=0;
function mouseScroll(e){
//事宜对象兼容
var e=e||window.event;
var down=null;
if(e.wheelDelta){
down=e.wheelDelta;//IE,Chrome
}else{
down=-e.detail;//FF,注重负号
}
counter(down);
}
//增加事宜
if(document.addEventListener){document.addEventListener("DOMMouseScroll",mouseScroll,false);}//FF
document.onmousewheel=mouseScroll;//IE/Chrome
//计数
function counter(count){
if(count>0){
oDelta.value=num++;
}else if(count<0){
oDelta.value=num--;
}
}
注:至于其他浏览器:如Opera,Safari.本人没有测试,查资料(传送门)得知,和IE/Chrome一样,只要FF奇特