点击图片，获取图片上对应的坐标

最新推荐文章于 2024-06-24 14:03:35 发布

轻松qinsong

最新推荐文章于 2024-06-24 14:03:35 发布

阅读量1.2w

点赞数

分类专栏：前端-HTML

本文链接：https://blog.csdn.net/u014136910/article/details/50484319

版权

前端-HTML 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body bgcolor="#999999">
<div style="position:absolute;top:250px;left:250px;"><img src="http://case.blueidea.com/files/2007/08/10/work_153803_1185_20070810_112151_644226_m.jpg" οnmοusemοve="vControl('GETMOUSEPOSINPIC',this)" /></div>
<script language="javascript" type="text/javascript">
var JPos = {};
(function($){
$.$getAbsPos = function(p){
var _x = 0;
var _y = 0;
while(p.offsetParent){
_x += p.offsetLeft;
_y += p.offsetTop;
p = p.offsetParent;
}

_x += p.offsetLeft;
_y += p.offsetTop;

return {x:_x,y:_y};
};

$.$getMousePos = function(evt){
var _x,_y;
evt = evt || window.event;
if(evt.pageX || evt.pageY){
_x = evt.pageX;
_y = evt.pageY;
}else if(evt.clientX || evt.clientY){
_x = evt.clientX + document.body.scrollLeft - document.body.clientLeft;
_y = evt.clientY + document.body.scrollTop - document.body.clientTop;
}else{
return $.$getAbsPos(evt.target);
}
return {x:_x,y:_y};
}
})(JPos);

function vControl(pChoice){
switch(pChoice){
case "GETMOUSEPOSINPIC":
var mPos = JPos.$getMousePos();
var iPos = JPos.$getAbsPos(arguments[1]);

window.status = (mPos.x - iPos.x) + " " + (mPos.y - iPos.y);

break;
}
}
</script>
</body>
</html>

轻松qinsong

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
3
评论
点击图片，获取图片上对应的坐标

无标题文档var JPos = {};(function($){$.$getAbsPos = function(p){var _x = 0;var _y = 0;while(p.offsetParent){_x += p.offsetLeft;_y += p.offsetTop;p = p.offsetParent;}_x +
复制链接

扫一扫