js中的『滚轮』事件和『滚动』事件

今天在写我们的官网人人信,发现 mousewheelFirefox 平台并不生效。

F 家使用的是 DOMMouseScroll 事件,event 中的属性是 detail ,而 C 家使用的是 mousewheel 事件,event 中的属性是 wheelDelta 。而且 detail 的值是 wheelDelta 的三倍大小,正负相反。

目前尚未就『滚轮』形成标准,毕竟滚轮并不是鼠标的标配哦。

咦?滚动不是标准吗?

『滚动』是标准,是 scroll 事件。
但是『滚轮』可就不是标准了。

『滚动』发生在当页面 body 滚动时,常用的属性是 pageYOffset ,是个偏移量。
『滚轮』发生在鼠标滚轮滚动的时候,我们可以阻止默认事件,从而达到一些我们希望的效果。

例如,当滚动到底部的时候,加载数据,展示返回顶部按钮,这都是 scroll 事件。
如果像我们的官网,是为了每次翻页一整屏,那就得使用 mousewheel 或者 DOMMouseScroll 了。

hq5544

I am 炒饭君. A front-end engineer.

Subscribe to hq5544 blog

Get the latest posts delivered right to your inbox.

or subscribe via RSS with Feedly!