鼠标滚轮条件判断

最新推荐文章于 2023-06-10 22:20:47 发布

草莓味的海绵宝宝

最新推荐文章于 2023-06-10 22:20:47 发布

阅读量346

点赞数

文章标签：前端 javascript 开发语言

本文链接：https://blog.csdn.net/weixin_60944739/article/details/126347392

版权

当我们要写一个动画时，需要判断鼠标是否滚动了再来出现某个动画，用

window.addEventListener('scroll', () => {}方法可以监听到高度，用

document.documentElement.onmousewheel = function (event) {}可以监听到鼠标滚轮动了

console.log(event.wheelDelta)显示的是个负数会随着电脑屏幕显示的扩大缩小倍数而改变，所以在判断滚轮发生不能写成死条件，例如：

if (event.wheelDelta == -120 ) {}

而应该改成

window.devicePixelRatio：获取电脑显示缩放扩大倍数

if (event.wheelDelta <= -120 * window.devicePixelRatio) {}

小于等于是因为浏览器还可以缩小扩大倍数

这样就可以解决滚动滑动触发条件

关注