鼠标滚轮事件

最新推荐文章于 2022-07-11 15:39:24 发布
最新推荐文章于 2022-07-11 15:39:24 发布
阅读量373 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_28292937/article/details/52495531
版权

鼠标滚轮事件

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<style>
#div1 {width: 100px; height: 100px; background: red;}
</style>
<script>
/*
鼠标滚轮事件
*/
window.onload = function() {
	
	var oDiv = document.getElementById('div1');
	
	/*
	ie/chrome : onmousewheel
		event.wheelDelta
			上：120
			下：-120
		
	firefox : DOMMouseScroll 必须用addEventListener
		event.detail
			上：-3
			下：3
			
	return false阻止的是  obj.on事件名称=fn 所触发的默认行为
	addEventListener绑定的事件需要通过event下面的preventDefault();
	*/
	oDiv.onmousewheel = fn;
	
	if (oDiv.addEventListener) {
		oDiv.addEventListener('DOMMouseScroll', fn, false);
	}
	
	//alert(2);
	
	function fn(ev) {
		//alert(1);
		
		var ev = ev || event;
		
		//alert( ev.wheelDelta );
		
		//alert(ev.detail)
		
		var b = true;
		
		if (ev.wheelDelta) {
			b = ev.wheelDelta > 0 ? true : false;
		} else {
			b = ev.detail < 0 ? true : false;
		}
		
		//alert(b);
		
		if ( b ) {
			this.style.height = this.offsetHeight - 10 + 'px';
		} else {
			this.style.height = this.offsetHeight + 10 + 'px';
		}
		
		if (ev.preventDefault) {
			ev.preventDefault();
		}
		
		return false;
		
	}
	
	/*document.oncontextmenu = function() {
		return false;
	}*/
	
	document.attachEvent('oncontextmenu', function() {
		return false;
	});
	
	/*document.addEventListener('contextmenu', function(ev) {
		
		ev.preventDefault();
		//return false;
	});*/
	
}
</script>
</head>

<body style="height: 2000px;">
	<div id="div1"></div>
</body>
</html>


张张张的博客
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
addEventListener() 方法，事件监听
milijiangjun的博客
11-27 4万+
addEventListener() 方法，事件监听 你可以使用 removeEventListener() 方法来移除事件的监听。 语法 element.addEventListener(event, function, useCapture); 第一个参数是事件的类型 (如 "click" 或 "mousedown"). 第二个参数是事件触发后调用的函
javascript实现禁止鼠标滚轮事件
10-23
主要介绍了javascript实现禁止鼠标滚轮事件的相关资料,需要的朋友可以参考下
在ES6类中绑定事件
目尽地平线
08-19 1万+
如何在ES6的类中写事件回调函数？如何访问类的this变量 ？如何隐藏事件回调函数，使外部不能访问
vue项目中阻止鼠标滚轮事件
明知迷途，从未折返
02-13 7411
mousewheel.prevent &lt;div class=“popUp” @mousewheel.prevent&gt;
addEventListener( ) 方法 -- 事件监听
m0_52545254的博客
07-11 6420
事件监听/捕获/冒泡
【three.js第七课】鼠标点击事件和键盘按键事件的使用
张小三的博客
06-06 8348
当我们使用鼠标操作three.js渲染出的对象时，不仅仅只是仅限用鼠标对场景的放大、缩小、旋转而已，还有鼠标左键、右键的点击以及键盘各种按键等等的事件。我们需要捕获这些事件，并在这些事件的方法里进行相关的操作。 接下来是干货 在【three.js第六课】的基础上，对代码进行整理后。得到本次试验的源码。下面的代码是在原来的第六课的基础上将对应的代码写成方法再进行调用的。 <!DOCTY...
javascript 鼠标滚轮事件
10-30
由于鼠标滚轮事件在 IE 和 FF 的实现有点不一样，所以有需要把这个写成一个统一可用的事件。
VB鼠标滚轮事件_vb6_鼠标滚轮事件_
09-30
VB6鼠标滚轮事件
html中鼠标滚轮事件onmousewheel的处理方法
09-01
下面小编就为大家带来一篇html中鼠标滚轮事件onmousewheel的处理方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
js捕获鼠标滚轮事件代码
10-26
本文为大家介绍下如何使用js捕获鼠标滚轮事件，原理很简单，感兴趣的朋友可以参考下
原生js中使用addEventListener实现拖拽事件
HadwinLing
10-06 4189
addEventListener()方法用于指向元素添加事件，注意在IE8及更早版本，opera7.0及更早版本都不支持addEventListener(),但是可以使用attchEvent()方法来进行添加事件 提示：使用removeEventListener()来溢出addEventListener()方法添加事件 代码实现部分 &lt;!DOCTYPE html&gt; &lt;html l...
扫盲-----addEventlistener()方法，事件监听(一)
热门推荐
yangchunshang的博客
06-04 5万+
一、扫盲事件起因    时间：2018年6月1日周五下午，原本我以为我已经把当前的bug改好，应该没啥问题了，坐等下班公司聚餐（开心）突然，隔壁同组大哥，哎。。。。cp,你看看，你这个首页报了很多错哎。我的第一反应就是，不可能，怎么会有错误呢，我明明都自己测过好几次了。我一看，我去，果然。。。。首页报的错误都是在我写的组件里面出现的同一个错误。我的天。。。。。当页面缩放时，渲染页面提示,某方法不存...
js addEventListener 鼠标事件类型汇总
子燕若水的博客
12-02 7278
Event Name Fired When auxclick A pointing device button (ANY non-primary button) has been pressed and released on an element. click (en-US) 在元素上按下并释放任意鼠标按键。 contextmenu (en-US) 右键点击（在右键菜单显示前触发）。 dblclick (en-US) 在元素上双击鼠标按钮。 mousedo
JavaScript addEventListener()事件监听方法详解
赵一舟的博客
03-12 4205
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> </head> <body> <p>该实例使用 addEventListener() 方法来向按钮添加点击事件。&lt...
addEventlistener()方法，事件监听
林中明月间丶
07-12 7843
addEventListener()方法，即为事件监听；可以使用removeEventListener()方法来移除事件的监听。 element 可以是 window、document、oDiv 等 //语法: element.addEventListener(event,function,Boolean); // 其中第一个参数是事件的类型（如'click 或 'mousedown'） // 第二个参数是事件触发后调用的函数。 // 第三个参数是个布尔值用于描述事件是冒.
window.addEventListener来解决让一个js事件执行多个函数
zunguitiancheng的专栏
06-03 1566
可能你也碰到过这种情况,就是在js的代码中用了window.onload后,可能会影响到body中的onload事件。这时就要用window.attachEvent和window.addEventListener来解决一下,需要的朋友可以参考下 可能你也碰到过这种情况,就是在js的代码中用了window.onload后,可能会影响到body中的onload事件。你可以全写在body中，也
mousemove事件，鼠标移动过快时，无法全部响应
青天诀的专栏
09-01 1万+
问题描述：项目中，运用mousemove来实现绘制圆形时，发现鼠标移动速度过快时，绘制的圆形，不能连接一起，中间出现断点，无法形成一条完整的路径。问题分析：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>事件</title> <style type="text/css">
js中addEventListener注册事件用removeEventListener解绑注意事项
guanfeii的博客
03-30 864
注册DOM事件的一种方式：addEventListener document.addEventListener('mousemove', function() { console.log('执行'); }); 上述事件绑定，我们是不能通过使用removeEventListener来将其解绑，因为addEventListener的第二个参数是一个匿名函数，所以removeEventListener的第二个参数是获取不到与其同名的函数；要想解绑addEventListener绑定的事件，可以通过下面实现
Qwidget 鼠标滚轮事件
最新发布
05-31
当用户在 QWidget 上使用鼠标滚轮时，该控件会发出鼠标滚轮事件信号，我们可以通过重载 QWidget 的 wheelEvent() 函数来处理这些事件。示例代码如下： ``` void MyWidget::wheelEvent(QWheelEvent *event) { if ...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值