views:

83

answers:

1

When you have multiple images that share the same imagemap, is there any way to detect which image was clicked on when a user clicks on the image?

I have created a little javascript app, where buildings (simple images) are placed on a map and can be dragged around. When a user clicks on a building, the building can be easily retrieved using e.target, then dragged around. When adding an imagemap (to increase click accuracy) however, e.target no longer works. Is there still a way to find out what image was clicked? It seems a bit weird that javascript can't detect that an image was clicked, when that image uses an imagemap?

So, if you have two images, both using usemap="samemap", how to find out which of the two was clicked when the imagemap is triggered?

A: 

I found a solution to this problem by using document.elementFromPoint(x,y). It simply tells what element lies at a given coordinate. By catching the coordinates of the mouseclick when clicking on an imagemap, this can be used to find the image that is below the imagemap. For Opera and Firefox elementFromPoint gives the image, even when the imagemap is still there. For Internet Explorer and Google Chrome I had to temporarily disable the imagemap, use document.elementFromPoint, and re-enable the imagemap.

After finding this out, I switched to another method, but maybe it helps someone else.

Pino