1.滚轮事件简述
当滚动鼠标滚轮或操作其它类似输入设备时会触发滚轮事件。
2.主要js代码
因标准未定义滚轮事件具体会引发什么样的行为,引发的行为实际上是各浏览器自行定义的。
window.addEventListener("wheel", function(e) {
let evt = e || window.event; //考虑兼容性
evt.preventDefault();
if (evt.deltaY > 0) { //在火狐中 向下滚动是3 谷歌是125
console.log("向下滚动");
} else { //在火狐中 向上滚动是-3 谷歌是-125
console.log("向上滚动");
}
//检查事件
console.log(evt.type, evt.deltaX, evt.deltaY, evt.deltaZ);
}, {
passive: false
});
因为做项目的时候有这个需求,所以是在参考了很多代码之后,修修改改得到的,
但是MDN文档的意思是:“滚轮事件获知文档内容滚动方向的方法并不可靠。要获取文档内容的滚动方向,可在文档内容滚动事件(scroll)中监视scrollLeft和scrollTop二值变化情况。”