bugzilla.mozilla.org has resumed normal operation. Attachments prior to 2014 will be unavailable for a few days. This is tracked in Bug 1475801.
Please report any other irregularities here.

Problematic triggering of mouseover events.




DOM: Events
7 years ago
18 days ago


(Reporter: milos, Unassigned)




Firefox Tracking Flags

(Not tracked)




(1 attachment)



7 years ago
User-Agent:       Mozilla/5.0 (Windows NT 6.1; rv:2.0.1) Gecko/20100101 Firefox/4.0.1
Build Identifier: Mozilla/5.0 (Windows NT 6.1; rv:2.0.1) Gecko/20100101 Firefox/4.0.1

When using jQueryUI to animate certain elements on a page, the plugin usually creates a new div for some special effects. If this div appears under the mouse cursor, and over another div that has a .mouseenter() event bound to it (which is basically an onmouseover event, with special propagation properties, but it works when .mouseover() is used as well), Firefox will keep firing the event indefinitely. Other browsers do not exhibit this behavior. An important thing to note is that the .mouseleave() (or .mouseout()) event isn't fired at all.

Reproducible: Always

Steps to Reproduce:
1. See provided link with a basic example.
2. Move the mouse into the red <div> element from the top, and leave the cursor within the first 50px (that should end up covered by the green <div>).

Actual Results:  
The green <div> will keep reappearing, because the .mouseenter() event for the red <div> keeps getting triggered.

Expected Results:  
The green <div> should appear and stay there until you move the mouse out of the red <div>.

The expected result is what happens when you move the mouse into the red <div> from the bottom-side and never touch the green <div>.

Tried it on Firefox 4.0.1 on Win7, and Firefox 4.0 on Ubuntu 10.10, the bug is observed in both.
Component: General → DOM: Events
Product: Firefox → Core
QA Contact: general → events
Version: unspecified → Trunk
Reproducible in latest nightly. Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:6.0a1) Gecko/20110523 Firefox/6.0a1
Ever confirmed: true
Hardware: x86 → All
Keywords: testcase

Comment 2

7 years ago
This page contains a possible client-side (jQuery) workaround, until the bug is resolved. Just putting this here if anyone encounters it, and searches for a solution.
So what's jquery actually doing for mouseenter and mouseleave?  What are hide() and show() actually doing?

We will trigger mouseover/out events on layout changes if things move under the mouse or out from under it, unlike other browsers.  so depending on what exactly jquery is doing here the behavior may well be correct.
And in particular, there should be a mouseout on the container when ending up over the small green div.  I'll attach a testcase that shows that behavior when the _mouse_ is moving; the behavior is the same when the _divs_ are moving in Gecko.  Other browsers, as I said, have bugs where they don't fire mouse in/out events or apply hover effects based on layout changes.
Created attachment 534987 [details]
Testcase showing that there are mouseout events on the container here

Mouse over the red area from the bottom, then keep moving the cursor up until you're over the green area.  Note that when you move from one to the other a mouseout fires on the container.
So as far as I can tell, this bug is invalid.

Move all DOM bugs that haven’t been updated in more than 3 years and has no one currently assigned to P5.

If you have questions, please contact :mdaly.
Priority: -- → P5
You need to log in before you can comment on or make changes to this bug.