onwheel 事件

DOM 事件 WheelEvent

实例

当用户在 <div> 元素上滚动鼠标滚轮时，更改其字体大小：

document.getElementById("myDIV").addEventListener("wheel", myFunction);

function myFunction() {
  this.style.fontSize = "35px";
}

亲自试一试

定义和用法

当鼠标滚轮在元素上向上或向下滚动时，会发生 onwheel 事件。

当用户使用触摸板滚动或放大或缩小元素时，也会发生 onwheel 事件。

浏览器支持

表中的数字注明了完全支持该事件的首个浏览器版本。

事件 Chrome IE Firefox Safari Opera
onwheel 31.0 9.0 17.0 不支持 18.0

注释：在 IE 中，只有通过 addEventListener() 方法才支持 wheel 事件。 DOM 对象上没有 onwheel 属性。

语法

在 HTML 中：

<element onwheel="myScript">

亲自试一试

在 JavaScript 中：

object.onwheel = function(){myScript};

亲自试一试

在 JavaScript 中，使用 addEventListener() 方法：

object.addEventListener("wheel", myScript);

亲自试一试

注释：Internet Explorer 8 或更早的版本不支持 addEventListener() 方法。

技术细节

冒泡： 支持
可取消： 支持
事件类型： WheelEvent
支持的 HTML 标签： 所有 HTML 元素
DOM 版本： Level 3 Events
DOM 事件 WheelEvent