Is there a way to find the div name out from from location(x,y cords)

Question

It is fairly easy to find the location of a div, when you know the div name. But is there an easy way to get the div id when all I know is the X/Y cords of the screen?

There will be no overlapping divs within a range of divs named '#Items1' to '#Items50' on a board (another div) called #HarbourRadar. Each div #Items can have more than one stacked image in it.

Anyway any hint to find the div out from a location would be greatly appreciated.

The following code (taken from the answer below on this side) gets the id of the div #HarbourRadar, that is partially right since the div #marker is layered ontop on that one, but does not return the div #marker that is selected - ie one with a higher Z-index.

var pos = $("#marker").position();
alert(document.elementFromPoint(pos.left, pos.top).id);

Answer 1

Yeah, it is possible using the document.elementFromPoint method.
This is how it is documented by Microsoft. Here is Mozilla documentation.
The function is almost fully compatible, as you can see in this browser comparison.

Here is some sample code from MDN docs:

function changeColor(newColor) {
  elem = document.elementFromPoint(2, 2);
  elem.style.color = newColor;
}

<p id="para1">Some text here</p>
<button onclick="changeColor('blue');">blue</button>
<button onclick="changeColor('red');">red</button>