js 鼠标滚轮

2019-02-22 16:52:40 阅读：166 来源： 互联网

标签：function 滚轮 false 鼠标 js alert addEventListener return ev

<!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 : onm ousewheel
		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>

在这里插入图片描述

标签：function,滚轮,false,鼠标,js,alert,addEventListener,return,ev
来源： https://blog.csdn.net/qq_35187942/article/details/87881519

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

js 鼠标滚轮