I have some simple problem to fire event when I dragging an image in mine drag and drop functionality. Normally, when I drag element everything is fine, but I need to place it down on other object. And here is a problem because when mouse pointer points on dragged element no onmouseover is fired on element that I'm over. If I move mouse a little faster that the browser cant draw it in real time then event is fired, because for a moment mouse points at this element. Any idea of solving this? Thanks :) Ahh and One thing - I do not cancel bubbling anywhere so hmm...
This Question has been solved and asker verified All Experts Exchange premium technology solutions are available to subscription members.
Experts Exchange has been collecting answers to technology questions since 1996…3 million and counting! If you have a question, chances are we already have your answer.
If you can't find the exact answer you're looking for, ask our exclusive community of 50,000 experts. You’ll get a personalized answer from a trusted professional.
Thousands of free tech tips, tricks, how-to’s and tutorials are available in our peer reviewed articles section. See for yourself how smart our experts are, no login required.
Save solutions to your questions, answers you’ve discovered through searching plus helpful articles in your personal knowledgebase for easy future access.
Access the answers to your technology questions today.
30-day free trial. Register in 60 seconds.
Members of the expert community talk about why the experience at Experts Exchange is different than what you will find anywhere else.
Try it out and discover for yourself.
30-day free trial. Register in 60 seconds.
Join the community of experts here and help other tech pros by answering question in your area of expertise. You can earn FREE access to all Experts Exchange's premium features and resources.
Thanks for your solution, actually this is one of idea that I found (for example in mootools). But I would like to do this in some simpler way. For example now I dragging element that it is a little under the mouse (1 px down and 1 px left) and this work ok, but I would like to show this element centered oh.. Any other ideas?
onmouseover will not work because the top-most element (i.e. the one you see drawn on the screen over everything else, i.e. the one you are dragging) is the only one that receives the mouse event. Effectively it is blocking the event from reaching the elements that are drawn underneath it, and there is no way round it.
As far as I am aware the only sure way to find which elements are under a single point is to check coordintates as I describe. It need not be complex, although it might be slow if you are checking lots elements. In that case it might be worth designing the application to use a different approach. (e.g. layout the targets in some determinate fashion so that the destination target can be calculated directly from the mouse coordinates.)
Business Accounts
Answer for Membership
by: Cometo1989Posted on 2008-06-03 at 07:44:38ID: 21700889
First let's clarify some things:
The onmouseover event fires when the mouse moves over a new element on the screen. The browser determines what that element is based on which elements (or parts of elements) are currently visible. Bubbling is the sending of the event to the elements up the DOM hierachy. It is not about sending events 'through' elements that are drawn on top of each other.
For your drag and drop application, perhaps you could use the coordinates of the "drop" event (e.g. an onmouseup event) and compare those with the coordinates of the various elements that can accept the dropped object. There is a lot on the web about how to do this, but here is some quick'n'dirty code to get you started.
Select allOpen in new window