473,394 Members | 1,738 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,394 software developers and data experts.

get XY coords of click on image

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="alertCoords(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"
Jul 23 '05 #1
2 10963
Some code from my libraries:

// Your client sniffer
is=new ClientSniffer()// Should set is.ie=true if IE & is.moz=true if
Mozilla...
// Abbrev Vars
_w=window
_d=document
// X & Y Code
function getEventX(e){
return is.ie?e.clientX+_d.body.scrollLeft:e.clientX+_w.pa geXOffset
}
function getEventY(e){
return is.ie?e.clientY+_d.body.scrollTop:e.clientY+_w.pag eYOffset
}

This code will work with both Mozilla and IE. It's not tested with any
other browsers.

JsD
Jul 23 '05 #2
Java script Dude wrote:
Some code from my libraries:
If its indicative of all your libraries, users should beware of it.
// Your client sniffer
is=new ClientSniffer()// Should set is.ie=true if IE & is.moz=true if
Mozilla...
Truely cross-browser scripts dont care what browser. It tests for
supported features, not browser names.
// Abbrev Vars
_w=window
_d=document
// X & Y Code
function getEventX(e){
return is.ie?e.clientX+_d.body.scrollLeft:e.clientX+_w.pa geXOffset
}
function getEventY(e){
return is.ie?e.clientY+_d.body.scrollTop:e.clientY+_w.pag eYOffset
}

This code will work with both Mozilla and IE. It's not tested with any
other browsers.


But you did not include the ClientSniffer() function, so it doesn't work.

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq
Jul 23 '05 #3

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
by: Dave Harris | last post by:
I have written a reasonably clean way to perform coordinate transformations on a polygon, but Tkinter Canvas is not being particularly cooperative. The following program has been distilled down to...
1
by: Vangelis Natsios | last post by:
I want to create a page with a scrolling image that will cause different messages to appear on another part of the page (say, another <div>) as the image will scroll. Imagine something like this: ...
4
by: Csaba2000 | last post by:
I want to be able to programatically click on the center of an <INPUT type=image ...> element (I only care about IE 5.5+). This should work regardless of whether IE has focus. Normally you would...
3
by: tommydog | last post by:
i am trying to generate an image map from the mouse coords of a click. i can pass the X Y through ok as $_POST $_POST how should the string be put into the AREA tag ? i am keeping the diameter...
3
by: Matthias Vodel | last post by:
Hi all, I want to change the beginning/end-coordinates of a canvas.line item. Something like: self.myCanvas.itemconfigure(item_id, coords=(x1_new, y1_new, x2_new, y2_new)) I don't want...
3
by: Rhishabh07 | last post by:
how to define coords in an image for an area shape i m using <img src="left.jpg" width="350" height="29" alt="Planets" usemap ="#planetmap" /> <map id ="planetmap" name="planetmap">...
13
by: sevenz24 | last post by:
So i have my images set up like this : http://cgi.ebay.com/Tippmann-98-paintBall-Marker-Gun-Paint-Ball_W0QQitemZ250274334261QQihZ015QQcategoryZ47248QQssPageNameZWDVWQQrdZ1QQcmdZViewItem Scroll...
1
by: Andrew Poulos | last post by:
I have a image in a scrollable DIV. The image is bigger than the display size of the DIV. How do I get the coordinates of a mouse click on the image relative to the top left corner of the image...
2
by: erbear | last post by:
Hi all, I am new to VB, and I am having some troubles. I have a listbox that when you click on the item it displays a picture in a picture box and a message in a label. It works fine when an item...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.