HTML中鼠标滚轮事件onmousewheel处理，靠着这份900多页的PDF面试整理

于 2024-04-09 22:24:27 发布
阅读量692 收藏 11
点赞数 24
分类专栏： 2024年程序员学习 文章标签： html pdf 面试
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2301_82243070/article/details/137570294
版权

Safari与Chrome属于同一类型，可使用HTML DOM方式添加事件

window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome

其中除Firefox外其余均可使用HTML DOM方式添加事件，因此添加事件使用以下方式

/*注册事件*/

if(document.addEventListener){

document.addEventListener(‘DOMMouseScroll’,scrollFunc,false);

}//W3C

window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome

detail与wheelDelta

判断滚轮向上或向下在浏览器中也要考虑兼容性，现在五大浏览器（IE、Opera、 Safari、Firefox、Chrome）中Firefox 使用detail，其余四类使用wheelDelta；两者只在取值上不一致，代表含义一致，detail与wheelDelta只各取两个 值，detail只取±3，wheelDelta只取±120，其中正数表示为向上，负数表示向下。

最低0.47元/天 解锁文章
2301_82243070
关注
  • 24
    点赞
  • 踩
  • 11
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
html中鼠标滚轮事件onmousewheel的处理方法
09-01
下面小编就为大家带来一篇html中鼠标滚轮事件onmousewheel的处理方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
JS滚轮事件onmousewheel使用介绍
10-26
鼠标滚轮滚动控制图片或者文字的大小，例如此类的转动鼠标滚轮实现缩放等等交互效果中，会用到 Mousewheel 事件，感兴趣的朋友可以了解下
JQ鼠标滚轮事件
01-22
JQ鼠标滚轮事件可以响应鼠标滚轮事件,JQ鼠标滚轮事件可以响应鼠标滚轮事件
监听鼠标滚轮事件
done1898的博客
11-16 435
js： //兼容性写法，该函数也是网上别人写的，不过找不到出处了，蛮好的，所有我也没有必要修改了 //判断鼠标滚轮滚动方向 if (window.addEventListener)//FF,火狐浏览器会识别该方法 window.addEventListener('DOMMouseScroll', wheel, false); window.onmousewheel = ...
鼠标滚轮事件
LiXiao_Lan的博客
01-03 505
1.布局 <div class="fonts white-bg"> <div class="fon" ref="tabList" @mousewheel="mouse">.........</div> </div> methods:{ mouse(event) { //滚轮事件 //wheelDelta是判断鼠标滚动方向的指标 //wheelDelta的值为正（120.240...）则是鼠标向...
鼠标滚轮滚动事件
pengxingjun的专栏
04-03 462
鼠标滚轮滚动事件 有时候我们会遇到一个页面有两个滚动条的问题，我们希望只有一个滚动条可以使用，以下代码可以使用： 首先我们要有一个页面滚动条，一个div的滚动条，我这里的div名为swf，flexpaper的显示div。function MouseWheel(e) { ///按下鼠标滚路，阻止视窗滚动 e = e || window.event;
js中鼠标滚轮事件详解(firefox多浏览器)
10-29
本文将详细介绍如何在JavaScript中处理鼠标滚轮事件，并解决Firefox等多浏览器的兼容性问题。 首先，让我们来看一下如何注册滚轮事件。在Internet Explorer和Opera浏览器中，我们可以使用`attachEvent`方法来添加...
用HTML5实现鼠标滚轮事件放大缩小图片的功能
09-28
这并不意味着我们的代码无法在Safari中工作，因为Safari仍然使用webkit引擎处理滚轮事件，所以代码应该能够正常执行。 总结来说，通过HTML5和JavaScript，我们可以轻松实现鼠标滚轮控制图片放大缩小的功能，从而...
鼠标和滚轮事件
qq_45303986的博客
11-12 999
enterEvent (QEvent *event) 鼠标进入事件。在小组件内按下或释放鼠标按钮或移动鼠标光标时，会发生鼠标事件。可以不用点击执行鼠标移动的内容。
javascript基础学习系列二百七十五：mousewheel 事件
wanmeijuhao的博客
01-27 847
IE6 首先实现了 mousewheel 事件。之后，Opera、Chrome 和 Safari 也跟着实现了。mousewheel 事件会在用户使用鼠标滚轮时触发，包括在垂直方向上任意滚动。这个事件会在任何元素上触发，并(在 IE8 中)冒泡到 document 和(在所有现代浏览器中)window。mousewheel 事件的 event 对象包含 鼠标事件的所有标准信息，此外还有一个名为 wheelDelta 的新属性。当鼠标滚轮向前滚动时， wheelDelta 每次都是+120;
滚轮事件和拖动滚动条和键盘事件
zhumizhumi的博客
07-11 5531
一、鼠标的滚轮事件 触发: 鼠标的滚轮上下滑动的时候触发 代码: // DOMMouseScroll:火狐 // onmousewheel:其他浏览器 if(window.addEventListener){ window.addEventListener('DOMMouseScroll',wheel,false) } window.onmousewheel = document['onmousewheel'] = wheel function wheel(event){ console.log(
JS中的鼠标滚轮事件（onmousewheel、判断滚动的wheelDelta、detail，取消浏览器默认行为的preventDefault()方法）
Fantasc的博客
08-11 9038
onmousewheel事件：会在鼠标滚轮滚动的时候被触发，对鼠标滚轮是否滚动进行判断，但是火狐浏览器不支持这个属性。DOMMouseScroll可以为火狐浏览器绑定滚动事件，它需要通过addEventListener函数来绑定。 event.wheelDellta：可以用来获取鼠标的滚动方向，对于得到的值，只看正负，往上滚是正值，往下滚是负值。火狐浏览器不支持这个方法，需要会用event.detail来获取滚轮的滚动方向，向上是负值，向下是正值。 在页面有滚动条的时候，滚动条会随着鼠标滚轮滚动..
HTML中鼠标滚轮事件onmousewheel处理
放逐的天空
02-09 6384
滚轮事件是不同浏览器会有一点点区别，一个像Firefox使用DOMMouseScroll ,ff也可以使用addEventListener方法绑定DomMouseScroll事件，其他的浏览器滚轮事件使用mousewheel，下面我来给大家具体介绍。Firefox使用
HTML中鼠标滚轮事件onmousewheel处理，近期想跳槽的程序员必看
最新发布
2401_84103327的博客
04-03 879
面试前要精心做好准备，简历上写的知识点和原理都需要准备好，项目上多想想难点和亮点，这是面试时能和别人不一样的地方。还有就是表现出自己的谦虚好学，以及对于未来持续进阶的规划，企业招人更偏爱稳定的人。万事开头难，但是程序员这一条路坚持几年后发展空间还是非常大的，一切重在坚持。为了帮助大家更好更高效的准备面试，特别整理了《前端工程师面试手册》电子稿文件。前端面试题汇总JavaScript性能linux前端资料汇总。
MFC控件响应鼠标中键OnMouseWheel
超频化石鱼的博客
02-09 7351
控件必须获取焦点才能响应OnMouseWheel。因此首先要在控件的OnLButtonDown里调用SetFocus();。然后重载控件的OnMouseWheel函数：BOOL CYuCvImageControl::OnMouseWheel(UINT nFlags, short zDelta, CPoint pt) { // TODO: Add your message handler code...
Vue框架学习笔记——事件scroll和wheel的区别
Aer_7z的博客
11-26 1533
描述scroll滚动条事件和wheel鼠标滚轮事件，以及二者的不同
JS事件-鼠标滚轮事件
热门推荐
每天进步一点点
05-27 2万+
之前学习了onmouseover，onmousedown等鼠标事件，今天来看看鼠标的滚轮事件，浏览器兼容一直是让人比较恶心的事情，今天就让我们将恶心进行到底，看看这个恶心的鼠标滚轮事件！   鼠标滚轮事件在IE和谷歌浏览器Chrome下是通过onmousewheel这个事件实现的，但是火狐FF下却不识别onmousewheel，在FF下需要用DOMMouseScroll，并且必须用“事件监听”
js 监听鼠标滚轮事件
05-24
在JavaScript中，可以使用`addEventListener`方法来监听鼠标滚轮事件。 具体实现方法如下： ```javascript // 获取需要监听滚轮事件的元素 var element = document.getElementById("elementId"); // 添加滚轮事件监听器 if (element.addEventListener) { // 针对Firefox等浏览器 element.addEventListener("DOMMouseScroll", mouseWheelHandler, false); } // 针对IE/Opera/Chrome等浏览器 element.onmousewheel = mouseWheelHandler; // 滚轮事件处理函数 function mouseWheelHandler(event) { var delta = 0; if (!event) { event = window.event; } if (event.wheelDelta) { delta = event.wheelDelta / 120; } else if (event.detail) { delta = -event.detail / 3; } // 对滚轮事件进行处理 // ... } ``` 其中，`element`表示需要监听滚轮事件的元素，`mouseWheelHandler`是滚轮事件处理函数，`event`参数是事件对象。 在滚轮事件处理函数中，可以通过判断`event.wheelDelta`和`event.detail`的值来获取滚轮滚动的方向和距离。对于`event.wheelDelta`，它的值为正数表示向上滚动，负数表示向下滚动；对于`event.detail`，它的值为正数表示向下滚动，负数表示向上滚动。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值