鼠标滚轮事件绑定的兼容性问题
<html>
<head>
<meta charset="utf-8">
<title>JavaScript判斷鼠標滾輪滾動方向- www.fengfly.com </title>
<script type="text/javascript">
function handle(delta) {
var s = delta+":";
if (delta <0){
s += "您在向下滾……";
}else{
s += "您在向上滾……";
}
document.getElementById('delta').innerHTML = s;
}
function wheel(event){
var delta = 0;
var event=event||window.event;
if (event.wheelDelta) {//ie||chrome||opera 滾輪每滾動一次,頁面滑動的距離120px?
? ? ? ? ? ? ? ?delta = event.wheelDelta/120; // 1 -1
? ? ? ? ? ? ? ? ? if (window.Safari){safari滾輪每滾動一次,頁面滑動的距離360px
? ? ? ? ? ? ? ? ? ? ? ? delta = event.wheelDelta/360; //1 -1
? ? ? ? ? ? ? ? ? }
} else if (event.detail) {//火狐 滾輪每滾動一次,頁面滑動的距離3px
? ? ? ? ? ? ? ? delta = -event.detail/3;//1 -1
}
if (delta){
? ? ? ? ?handle(delta);
? ? }
}
if (window.addEventListener){
window.addEventListener('DOMMouseScroll', wheel, false);
window.onmousewheel = document.onmousewheel = wheel;
}
</script>
</head>
<body>
<div id="delta">滾動中輪試試~請選按著中輪滾動,激活后可以不按,直接滾動。 </div>
<p>shared by http://www.111cn.net</p>
<div>
?Firefox 鼠標滾輪向上滾動是-3,向下滾動是3<br/>
?IE 鼠標滾輪向上滾動是120,向下滾動是-120<br/>
?Safari 鼠標滾輪向上滾動是360,向下滾動是-360<br/>
?Opera 鼠標滾輪向上滾動是120,向下滾動是-120<br/>
?Chrome 鼠標滾輪向上滾動是120,向下滾動是-120
</div>
</body>
</html>
轉載于:https://www.cnblogs.com/huangshikun/p/7027913.html
總結
以上是生活随笔為你收集整理的鼠标滚轮事件绑定的兼容性问题的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: C# 读取指定文件夹下所有文件
- 下一篇: 父类和子类在同一张表