I remember doing something like this before, but it's been a while since
I've touched javascript...
I have a standard <img> and when a user clicks the image I want
to output the IMAGE x y coordinates of the mouse click (i.e. not
the page x y coords).
I know that appending 'ismap' to the image tag will give me the image
coordinates, but I can't use that since the img already has a
'usemap' attribute.
I did some searching on google and came up with the following code
which only seems to return the page XY coordinates:
<script type="text/javascript">
<!--
var getX = function(evt){
if(evt.x){ return evt.x; }
if(evt.pageX){ return evt.pageX; }
}
var getY = function(evt){
if(evt.y){ return evt.y; }
if(evt.pageY){ return evt.pageY; }
}
var alertCoords = function(evt){
alert("X = "+ getX(evt) +"\nY = "+ getY(evt));
}
// -->
</script>
</head>
<body>
<div onclick="alertC oords(event);"> Click ME</div>
</body>
</html>
The code I'm looking for should be something similar!
Thanks :)
--
"I hear ma train a comin'
.... hear freedom comin"
I've touched javascript...
I have a standard <img> and when a user clicks the image I want
to output the IMAGE x y coordinates of the mouse click (i.e. not
the page x y coords).
I know that appending 'ismap' to the image tag will give me the image
coordinates, but I can't use that since the img already has a
'usemap' attribute.
I did some searching on google and came up with the following code
which only seems to return the page XY coordinates:
<script type="text/javascript">
<!--
var getX = function(evt){
if(evt.x){ return evt.x; }
if(evt.pageX){ return evt.pageX; }
}
var getY = function(evt){
if(evt.y){ return evt.y; }
if(evt.pageY){ return evt.pageY; }
}
var alertCoords = function(evt){
alert("X = "+ getX(evt) +"\nY = "+ getY(evt));
}
// -->
</script>
</head>
<body>
<div onclick="alertC oords(event);"> Click ME</div>
</body>
</html>
The code I'm looking for should be something similar!
Thanks :)
--
"I hear ma train a comin'
.... hear freedom comin"
Comment