- Jun 17, 2006Hi Scott,
On 6/17/06, Scott Schiller <idliketowork@...> wrote:
> Regarding this demo:
> One interesting thing to note here is that if while dragging, you move your mouse around quickly enough (IE and Firefox on my machine,) the dragged element will "lag" behind the mouse cursor and therefore will not be directly underneath the cursor. At this point, a mouseover can fire on the drag target since the cursor's "view" of the elements underneath is unobstructed.
These accidental fire's that occur when the dragged item lags behind
is exactly how I discovered the donut idea. In my first few days with
dragdrop I just assumed that even if the dragged item was under the
cursor that target mouseovers would still fire.
> Again due to "lag," it's possible that elements may fall behind the mouse cursor while moving depending on CPU load etc., effectively "blocking" mouse events if they are sitting underneath the cursor. I suspect this is something that may be difficult to minimize, but the chance of failure should be relatively low. (ie., it's possible a user might drag to a target very quickly and the "lag" works out such that the mouse was always blocked by an element while moving, thus a mouseover may not fire on the target even though the mouse may be hovering over it by the time the drag is finished.)
Yes the donut proxy can still lag behind but when it catches up the
hole will be under the cursor and the native browser events will fire.
Only very small holes make this a big problem. If the user can
tolerate a 10x10px hole things work relatively smoothly.
> Earlier prototypes of some drag-and-drop stuff I was working on arranged items in a circle around the mouse cursor while moving, which allowed for native mouseover/out events to fire on elements as the drag was in progress. It was a bit different visually, and all dragged elements' positions were being updated individually, likely not as efficient as moving a single proxy which contained said elements, but native over/out events did fire.
I knew this wasn't completely new:) The donut method would likely
implementations. The remainder of elements inside these divs would be
> I think this has the potential to be much more efficient than doing coordinate checks (even with caching ie., calculate and store positions/sizes onmousedown, then reference for the duration of mousemove until mouseup), given that the browser is designed to handle mouse events. Even though looping through an array of numeric values and doing <=, >= comparisons etc. for "collision detection" should be quite fast, of course "less" is always better. ;)
The boring outline donut is the simplest and fastest. I think the next
fastest would be a single image drag. It would be very easy to
position a single image inside the donut's four divs to make a nice
punctured image proxy.
- << Previous post in topic Next post in topic >>