Get element at specified position - JavaScript
Using Javascript how can I identify the element at a given position? Basically I'm looking to write a function that takes two input parameters (the x and y coordinates) and returns the html element at the position on the screen represented by the parameters.
Answers:
document.elementFromPoint(x, y);
http://dev.w3.org/csswg/cssom-view/#dom-document-elementfrompoint
http://msdn.microsoft.com/en-us/library/ms536417%28VS.85%29.aspx
https://developer.mozilla.org/en/DOM/document.elementFromPoint
You can use the native JavaScript elementFromPoint(x, y) method, that returns the element at coordinates x,y in the viewport.
See the elementFromPoint w3c draft
And, a code sample:
function changeColor(newColor) {
// Get the element placed at coords (2, 2)
var elem = document.elementFromPoint(2, 2);
// Set the foreground color to the element
elem.style.color = newColor;
}<p id="para1">Change this text color using the following buttons.</p>
<button onclick="changeColor('blue');">Blue</button>
<button onclick="changeColor('red');">Red</button>You can use setInterval() to continuously check the element's hover event but it's not recommended, try to use .hover(...) and css instead to enhance the application performance.