[Javascript] Event question and finding pointer position at event

[moseley at hank.org (Bill Moseley)]

On Tue, Mar 28, 2006 at 12:09:05PM -0500, Steve Clay wrote:
> Tuesday, March 28, 2006, 11:39:32 AM, Triche Osborne wrote:
> > each move. I'm thinking it means that "onmouseover" means quite
> > literally what it says: Any time the mouse moves over the element, it 
> 
> No, onmouseover will fire the instant the mouse becomes "over" the element.
> In Bill's case, the "refiring" of this is caused by the onmouseover event
> of child elements bubbling down to the parent. See:
> http://www.quirksmode.org/js/events_order.html

Yes, I've read that.  Perhaps I'm missing something.

I always think of bubbling up or capturing, but not bubbling down.

Anyway, I see the problem, but not clear how to fix.  This must be a
common situation.


Here's a demo that shows the bubble:

    http://hank.org/demos/event.html

In the debug output, these show that event firing on the <p> but the
<div> is where the event handler is attached:

    8: << off menu for element <P>
    7: >> on menu for element <P>


The goal is to only see the events when going inside or outside the
<div> with the red border.  Perhaps that is not possible?

Can't look at the nodeName, as that can be "<div>" even when inside
the <div> box -- as can be seen when moving around inside the "menu"
area.

So need to stop propagation (bubbling) of the inside events
to the outer <div>.

I tried wrapping the contents of the outer <div> with an inner <div>
with events that cancel the bubble, but that still doesn't work:

    http://hank.org/demos/event2.html

I can stop propagation, but there's still direct events on the outer
<div> when moving off inside elements onto the outer div.





-- 
Bill Moseley
moseley@xxxxxxxx