Skip to content
Create a gist now

Instantly share code, notes, and snippets.

A simple helper that returns a list of elements at a given point using elementFromPoint
* @author Kerry Liu
//test for ie: turn on conditional comments
var jscript/*@cc_on=@_jscript_version@*/;
var styleProp = (jscript) ? "display" : "pointerEvents";
var KoreSampl = function() {};
KoreSampl.prototype.fromEvent = function(e, lastElement) {
e = e || window.event; //IE for window.event
return this.atPoint(e.clientX, e.clientY, lastElement);
KoreSampl.prototype.atPoint = function(clientX, clientY, lastElement) {
//support for child iframes
var d = (lastElement) ? lastElement.ownerDocument : document;
//the last element in the list
lastElement = lastElement || d.getElementsByTagName("html")[0];
var element = d.elementFromPoint(clientX, clientY);
if(element === lastElement || element.nodeName === "HTML") {
return [element];
} else {
var style=[styleProp];[styleProp]="none"; //let us peak at the next layer
var result = [element].concat(this.atPoint(clientX,clientY,lastElement));[styleProp]= style; //restore
return result;
window["KoreSampl"] = new KoreSampl();
gwwar commented Mar 23, 2012

Sample usage:

Up to a given container element:

$(domEle).click(function(event) {
      //prints out everything up to domEle     
      console.log(KoreSampl.fromEvent(event, domEle));      

Everything up to root html node

$(window).click(function(event) {
      //prints out everything up to domEle     
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.