# Find element at coordinate (x,y)

67 views

### Rajeev J Sebastian

Sep 16, 2009, 12:17:06 PM9/16/09
Hi,

Could anyone suggest the best way to find an element at a given
coordinate (x,y) ?

Right now, I'm using my own search algorithm, but I'm wondering if
anyone has already written an efficient way to do this.

Regards
Rajeev J Sebastian

### Aaron Newton

Sep 16, 2009, 12:53:45 PM9/16/09
I wonder if you could simulate a mouse click at the location...

### Rajeev J Sebastian

Sep 16, 2009, 1:14:20 PM9/16/09
On Wed, Sep 16, 2009 at 10:23 PM, Aaron Newton <aa...@iminta.com> wrote:
> I wonder if you could simulate a mouse click at the location...

Good idea ... ill try that.

Regards
Rajeev J Sebastian

### Jan Kassens

Sep 16, 2009, 2:03:28 PM9/16/09
I’m afraid there isn’t a general fast solution. If either the number
of elements is limited (i.e. you want to know if its one of these
elements) you could check only the bounds of those elements.
If the elements are not moving on the page, you could for sure create
bounding boxes, for instance R-trees seem to be good here: http://en.wikipedia.org/wiki/R-tree

Jan

--
Jan - MooTools comitter

### Rajeev J Sebastian

Sep 16, 2009, 2:09:37 PM9/16/09
On Wed, Sep 16, 2009 at 11:33 PM, Jan Kassens <janka...@gmail.com> wrote:
>
> I’m afraid there isn’t a general fast solution. If either the number of
> elements is limited (i.e. you want to know if its one of these elements) you
> could check only the bounds of those elements.
> If the elements are not moving on the page, you could for sure create
> bounding boxes, for instance R-trees seem to be good here:
> http://en.wikipedia.org/wiki/R-tree

It is something similiar to what I'm doing now. Thanks for the link though.

Regards
Rajeev J Sebastian

### Y. Leretaille

Sep 16, 2009, 7:36:33 PM9/16/09
to MooTools Users
This problem challenged me, so i wrote my own implementation of this,
that can be found here: http://yann.sciency.net/mootools/getOnPosition.html
It extends "Element" by a getElementsByPosition-Function, is 567 Bytes
big and fast enough for efficient use in scripts (in my opinion).
It supports two different modes and is restrictable to a group of
elements (since it can be called from any element).
My Benchmarks are:
Firefox 3.5:
~0,0055s
Internet Explorer 6:
~0,013s

Hope this may help somebody.

Yann Leretaille

P.S.: This is my first contribution of a mootools-script to the
community so I would be pleased to receive some feedback from yo :)

### Fábio M. Costa

Sep 16, 2009, 7:58:44 PM9/16/09
Did you try event.target?
:S

--
Fábio Miranda Costa
Solucione Sistemas
Front-End Engineer
http://meiocodigo.com

### nwhite

Sep 16, 2009, 8:06:06 PM9/16/09

Did you try event.target?
:S

event.target is great. but what event do you fire and how do you fire it at a specific x,y position?

### Y. Leretaille

Sep 16, 2009, 8:07:44 PM9/16/09
to MooTools Users
> Did you try event.target?
> :S
This works only when the mouse is over the element and will only
return the element that is on top. My Function works with any
coordinate and returns all elements at the given position.
Yann

### Fábio M. Costa

Sep 16, 2009, 8:09:30 PM9/16/09
ye ye i got it now, i see the purpose.
Nice stuff!

--
Fábio Miranda Costa
Solucione Sistemas
Front-End Engineer
http://meiocodigo.com

### Sanford Whiteman

Sep 16, 2009, 8:12:11 PM9/16/09
to Y. Leretaille
> P.S.: This is my first contribution of a mootools-script to the
> community so I would be pleased to receive some feedback from yo :)

Clicking 'benchmark' froze my FF 3.0.14 a few times in a row. But I do

Have you tested in FF 3?

-- Sandy

### Sebastian Markbåge

Sep 22, 2009, 8:11:33 PM9/22/09
to MooTools Users
Ehm... document.elementFromPoint(x, y); Isn't this what you're looking
for? It's supported by WebKit, IE, Opera and FF3.

https://developer.mozilla.org/En/DOM/document.elementFromPoint

I use it to find drag and drop targets.

If you need to find an element below that position (that isn't a
parent node) - you can hide (display none) the hit target recursively
until you find the one you want.

### Sebastian Markbåge

Sep 22, 2009, 8:28:14 PM9/22/09
to MooTools Users
Btw, I use this to send events "through" a ghost element. For each
interaction event that occurs on the ghost element:

1. hide the ghost element.
2. elementFromPoint to find the underlying element.
3. show the ghost element.
4. bubble up events through the target element.

I do this twice for each mousemove event without any flickering
issues. So it's fast.

That way you can have elements floating around that the user can't
interact with.