Skip to content

Instantly share code, notes, and snippets.

@Rooster212

Rooster212/elementsFromPoint.ts

Created March 22, 2016 15:00
Show Gist options
  • Save Rooster212/f29bd0599ba1fe1a2238 to your computer and use it in GitHub Desktop.
Save Rooster212/f29bd0599ba1fe1a2238 to your computer and use it in GitHub Desktop.
Download ZIP
elementsFromPoint method that returns an Element[] so that we can have all the array methods (elementsFromPoint normally returns a NodeList). See my elementsFromPoint.js gist for fork details etc.
Raw
elementsFromPoint.ts
export function elementsFromPoint(x, y): Element[] {
var elements = [], previousPointerEvents = [], current, i, d;
// chrome supports this (and future unprefixed IE/Edge hopefully)
if (typeof (<any>document).elementsFromPoint === "function")
return Array.prototype.slice.call((<any>document).elementsFromPoint(x, y));
// IE11/10 should support this
if (typeof document.msElementsFromPoint === "function")
return Array.prototype.slice.call(document.msElementsFromPoint(x, y));
// get all elements via elementFromPoint, and remove them from hit-testing in order
while ((current = document.elementFromPoint(x, y)) && elements.indexOf(current) === -1 && current != null) {
// push the element and its current style
elements.push(current);
previousPointerEvents.push({
value: current.style.getPropertyValue('pointer-events'),
priority: current.style.getPropertyPriority('pointer-events')
});
// add "pointer-events: none", to get to the underlying element
current.style.setProperty('pointer-events', 'none', 'important');
}
// restore the previous pointer-events values
for (i = previousPointerEvents.length; d = previousPointerEvents[--i];) {
elements[i].style.setProperty('pointer-events', d.value ? d.value : '', d.priority);
}
// return our results
return elements;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment