How to generate multiple mousedown events with overlapping objects in jQuery?

Question

I have several (somewhat) overlapping divs, and if the user clicks on part of the overlap, I want a mousedown event (or any similar callback) for each div that's below the mouse coordinates.

The standard way, of course, only generates a callback for the topmost div. Is this possible?

Answer 1

I ended up drawing a big (empty) div on top of everything, storing each smaller guy's position, and then handling the mousedown event from the big div and distributing it to the little ones.

It's a little better than iterating through all divs on the page because there's some structure to where they are, so the lookup is faster.

Answer 2

Use motionbox http://github.com/tobowers/motionbox-eventhandler