Find element at coordinate (x,y)

67 views
Skip to first unread message

Rajeev J Sebastian

unread,
Sep 16, 2009, 12:17:06 PM9/16/09
to mootool...@googlegroups.com
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

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

Rajeev J Sebastian

unread,
Sep 16, 2009, 1:14:20 PM9/16/09
to mootool...@googlegroups.com
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

unread,
Sep 16, 2009, 2:03:28 PM9/16/09
to mootool...@googlegroups.com
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
twitter/blog: http://kassens.net

Rajeev J Sebastian

unread,
Sep 16, 2009, 2:09:37 PM9/16/09
to mootool...@googlegroups.com
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

unread,
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

unread,
Sep 16, 2009, 7:58:44 PM9/16/09
to mootool...@googlegroups.com
Did you try event.target?
:S


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

nwhite

unread,
Sep 16, 2009, 8:06:06 PM9/16/09
to mootool...@googlegroups.com

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

unread,
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

unread,
Sep 16, 2009, 8:09:30 PM9/16/09
to mootool...@googlegroups.com
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

unread,
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
appreciate your contribution. ;)

Have you tested in FF 3?

-- Sandy

Sebastian Markbåge

unread,
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

unread,
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.
Reply all
Reply to author
Forward
0 new messages