minimum x-coord of an image when clicked

[optimistx]

When we click an image, we get the coordinates x and y in the event
handler, like this

<script type="text/javascript">
function fun2(evnt){
var e=evnt;
if (e==undefined){e=event;}
var x=e.x || e.layerX;
var y=e.y || e.layerY;
alert('x='+x+' y='+y';
return true;
}
</script>

....

<img src="test.jpg" onclick="fun2(event)" />

How to determine minimum x and minimum y in my script?

Thanks in advance!

 

[Fred Oz]

When we click an image, we get the coordinates x and y in the event
handler, like this

<script type="text/javascript">
function fun2(evnt){
var e=evnt;
if (e==undefined){e=event;}
var x=e.x || e.layerX;
var y=e.y || e.layerY;
alert('x='+x+' y='+y';
return true;
}
</script>

Is this OK? Works in IE, Safari and Firefox:

<script type="text/javascript">
function fun2(evnt){
var e = evnt || window.event;

// I think the following line should be
// var ele = e.target || e.srcElement;
// for older IE but I can't test it right now
var ele = e.target;
var x = e.x || e.layerX;
var y = e.y || e.layerY;

var msg = [' Element clicked on: ' + ele.nodeName ,
' ' + ele ,
'\n Click location (x,y) = ' ,
'(' + x + ',' + y + ')',
'\n offsetWidth = ' + ele.offsetWidth ,
'\n offsetHeight = ' + ele.offsetHeight ,
'\n offsetTop = ' + ele.offsetTop ,
'\n offsetLeft = ' + ele.offsetLeft ,
'\n offsetParent = ' + ele.offsetParent ,
'\n offsetParent offsetTop = ',
ele.offsetParent.offsetTop ,
'\n offsetParent offsetLeft = ' ,
ele.offsetParent.offsetLeft ];

alert(msg.join(''));
}
</script>


[...]

How to determine minimum x and minimum y in my script?

Exactly what do you mean by "minimum x and minium y"? If you
mean the position of the top left corner of the element clicked
on, then its position must be calculated carefully as each
browser handles it differently. Search through this newsgroup
for offsetParent.

There is a good discussion of the viewport, its properties and
browser support here:

<URL:http://www.quirksmode.org/js/>

Click on the viewport link - hope that helps.

 

[optimistx]

There is a good discussion of the viewport, its properties and
browser support here:

<URL:http://www.quirksmode.org/js/>

Click on the viewport link - hope that helps.

Thanks Fred,

that was exactly what was needed. A marvellous, useful site. You guessed
the top/left corner thingy right, too.