您的位置：首页 > 其它

鼠标位置距浏览器窗口距离

2015-06-07 16:25 323 查看

代码如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
<style type="text/css">
#test_div {
	width:400px;
	height: 400px;
	background-color: red;
}
</style>
	</head>
	<body>
	<div id="test_div"></div>
	</body>
<script type="text/javascript">
	function mousePos(e){
		e=e||window.event;
		var scrollX=document.documentElement.scrollLeft||document.body.scrollLeft;//分别兼容ie和chrome
		var scrollY=document.documentElement.scrollTop||document.body.scrollTop;
		var x=e.pageX||(e.clientX+scrollX);//兼容火狐和其他浏览器
		var y=e.pageY||(e.clientY+scrollY);
		console.log(x,y);
		return {x:x,y:y};
	}
	var test=document.querySelector("#test_div");
	test.onclick=function(e){
		mousePos(e);
	}
</script>
</html>

其中的document.documentElement.scrollLeft和document.body.scrollLeft分别是ie和chrome的方法，而火狐中的pageX可以直接获取滑动的距离。

代码位置如下：

http://runjs.cn/code/6a8wblce

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航