ansaurus

Question

registering clicks on an element that is under another element

Answer 1

+9 A:

If you topmost element is contained within the element below, you can let the event "bubble through". If it is not, you have to trigger the click manually. There is no way to fire the event handler just by clicking.

To fire the event manually, you could do this:

$("#topelement").click(function() {
   $("#elementbelow").click();
   return false;
});

EDIT (response to comments):

To enumerate all boxes, you can do this (off the top of my head. no testing, could not even be syntax-error free)

$("#topelement").click(function(e) {
    $(".box").each(function() {
       // check if clicked point (taken from event) is inside element
       var mouseX = e.pageX;
       var mouseY = e.pageY;
       var offset = $(this).offset;
       var width = $(this).width();
       var height = $(this).height();

       if (mouseX > offset.left && mouseX < offset.left+width 
           && mouseY > offset.top && mouseY < offset.top+height)
         $(this).click(); // force click event
    });
});

Philippe Leybaert 2009-07-18 19:59:19

substituting #topelement -> #past, #elementbelow -> #container didn't work.

Sam Hasler 2009-07-18 20:04:07

Note there are several elements below the topmost element, I want to know which was clicked on.

Sam Hasler 2009-07-18 20:05:04

You would have to enumerate all DOM elements to see if the clicked point is inside one or more elements. There is no way the browser can do this for you

Philippe Leybaert 2009-07-18 20:06:51

I didn't expect the browser to do this for me. I'm asking how to enumerate those DOM elements.

Sam Hasler 2009-07-18 20:10:05

Thanks that worked a treat: http://jsbin.com/onamo/edit

Sam Hasler 2009-07-18 21:16:57

ansaurus

tags:

views:

answers:

registering clicks on an element that is under another element

related questions