Вход

Просмотр полной версии : Узнать координаты курсора в элементе.

bazilio2010
26.11.2011, 22:56
Вот собственно говоря скрипт определения и вывода координат курсора мыши относительно окна браузера мне бы хотелось его переделать.
Что бы он работал относительно элемента (изображения). То есть ноль х и у находились в левом верхнем углу не окна браузера, а элемента. Подскажите, очень надо заранее благодарю.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script language="JavaScript" type="text/javascript">
ns4 = (document.layers)? true:false
ie4 = (document.all)? true:false

function init() {
if (ns4) {document.captureEvents(Event.MOUSEMOVE);}
document.onmousemove=mousemove;
}
function mousemove(event) {

var mouse_x = y = 0;
if (document.attachEvent != null) {
mouse_x = window.event.clientX;
mouse_y = window.event.clientY;
} else if (!document.attachEvent && document.addEventListener) {
mouse_x = event.clientX;
mouse_y = event.clientY;
}
status="x = " + mouse_x + ", y = " + mouse_y;
document.getElementById('xy').innerHTML = "x = " + mouse_x + ", y = " + mouse_y;
}
init()
</script>


</head>

<body>

<span id="xy"></span> <br />
<img src="2.jpg" border=0 />
</body>

</html>
bazilio2010
26.11.2011, 23:11
Вот так я пытался решить эту проблему , но не удачно (

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script language="JavaScript" type="text/javascript">
ns4 = (document.layers)? true:false
ie4 = (document.all)? true:false

function init() {
if (ns4) {document.captureEvents(Event.MOUSEMOVE);}
document.onmousemove=mousemove;
}
function mousemove(event) {

var mouse_x = y = 0;
var i = document.getElementById('img');
if (document.attachEvent != null) {
mouse_x = i.event.clientX;
mouse_y = i.event.clientY;
} else if (!document.attachEvent && document.addEventListener) {
mouse_x = event.clientX;
mouse_y = event.clientY;
}
status="x = " + mouse_x + ", y = " + mouse_y;
document.getElementById('xy').innerHTML = "x = " + mouse_x + ", y = " + mouse_y;
}
init()
</script>


</head>

<body>

<span id="xy"></span> <br />
<img id="img" src="2.jpg" border=0 />
</body>

</html>
Magneto
27.11.2011, 01:11
Как вариант (http://javascript.ru/forum/css-html-firefox-mizilla/16741-koordinaty-klika.html#post101681).