master

分支 (2)

管理

管理

master

dev_test

web-test
/
JS之clientX,clientY,screenX,screenY,of...

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			<style>* {
				padding: 0;
				margin: 0;
			}

			.container {
				width: 200px;
				height: 100px;
				border: 1px solid #c00;
			}

			input[type="button"] {
				margin: 50px;
				border: none;
				width: 100px;
				height: 50px;
				background: green;
			}
		</style>
		</style>
	</head>
	<body>
		<span style="white-space:pre"> </span>
		<div id="div" class="container"></div>
		<span style="white-space:pre"> </span>
		<div id="div1" class="container"></div>
		<span style="white-space:pre"> </span><input type="button" value="test" onclick="test()"/>
	</body>
</html>
<script>
	document.onmousemove = function(ev) {
		var e = ev || window.event;
		var div = document.getElementById('div');
		div.innerHTML = "clientX: " + e.clientX + ",clientY:" + e.clientY +
			"</br> screenX:" + e.screenX + ",screenY:" + e.screenY;
	}
	function test(ev) {debugger;
		var e = ev || window.event;
		var div1 = document.getElementById('div1');
		div1.innerHTML = "offsetX:" + e.offsetX + ",offsetY : " + e.offsetY;
	}
</script>