Click location on image in FireFox?

HansAtWork · 08-11-2005, 12:23 PM

Hello,
I want to capture the mouseposition when an image is clicked. I get it in IE like this:
posx = window.event.offsetX
posy = window.event.offsetY
In case off click on the upper left corner of the image, result is posx=0, posy=0.
This does not work in FireFox. (offsetX and offsetY do not exist ).
I tried this for handling the onclick event:
function HandleMapClick(e)
{
posx = e.layerX;
posy = e.layerY;
}
However, this seems to give the mouseposition calculated from the upper
left corner of the browser. I want it from the upper left corner off the image.
Can anyone help me? Thanks in advance!

Kor · 08-11-2005, 01:14 PM

Welcome to the Forum!

Is this what you are looking for?:

PHP Code:


			
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>Untitled Document</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<meta http-equiv="Content-Style-Type" content="text/css">

<meta http-equiv="Content-Script-Type" content="text/javascript">

<style type="text/css">

<!--

body{

margin-left:0px;

margin-top:100px;

}

-->

</style>

<script type="text/javascript">

var mX;var mY;

function checkS(e){// captures the mouse position

mX = 0;mY = 0;

if (!e) {var e = window.event};//IE

if (e.pageX || e.pageY){//Moz

mX = e.pageX; mY = e.pageY;

}

else if (e.clientX || e.clientY){//IE

mX = e.clientX-2; mY = e.clientY-2;//IE correction

}

}

function showP(obj){

var oX = obj.offsetLeft;var oY = obj.offsetTop;

while(obj.parentNode){// finds the absolute position of the object

oX=oX+obj.parentNode.offsetLeft;

oY=oY+obj.parentNode.offsetTop;

if(obj==document.getElementsByTagName('body')[0]){break}

else{obj=obj.parentNode;}

}

var rX=mX-oX;//relative X

var rY=mY-oY;//relative Y

alert('the relative mouse position is: X='+rX+' Y='+rY)

}

</script>

</head>

<body onmousemove="checkS(event)">

<img src="00.jpg" border="0" align="right" onclick="showP(this)"> 

</body>

</html>

As you can see, IE needs a correction of -2:-2 (x:y) pixels, I don't know why..., Bill Gates should know....

HansAtWork · 08-11-2005, 02:19 PM

Yes, that is exactly what i need. Many thanks!