03onmousewheel

兼容问题

火狐

1. 兼容火狐注册方式DOMMouseScroll，使用addEventListener
2. 其他使用onmousewheel即可

判断滚动方向。

1. 火狐使用detail,值是正负3
2. 其他使用wheeldelta，值是正负120
3. 向下滚动为负值

项目中使用

1. deltaY和wheeldelta正负相反
2. MDN 中event.detail已经标记为红色、
3. 事件中有

• deltaX
• deltaY
• deltaZ
• wheeldelta,和wheeldetalY 相同
• wheeldeltaX
• wheeldeltaY

function onwheel(event) {
    var deltaY = 0;
    if (event.deltaY) {  // IE 9+, Chrome 3.1+ ,FireFox 17+
        deltaY = event.deltaY
    }else {
        deltaY = -event.wheeldelta // 注意两者相反
    }
}
// 之后通过判断 deltaY 的正负，进行放大缩小的操作

getBoundingClientRect.png