Side navigation
#4469 closed bug (worksforme)
Opened April 01, 2009 10:08PM UTC
Closed November 19, 2010 10:17PM UTC
Last modified March 13, 2012 05:00PM UTC
Event: hover does not trigger properly when scroll bars are present
Reported by: | sairex | Owned by: | |
---|---|---|---|
Priority: | major | Milestone: | 1.4 |
Component: | event | Version: | 1.3.2 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
Hover does not properly trigger on/off when its parent container has an overflow: scroll/auto property set to it.
For example:
http://docs.jquery.com/Events/hover
Modify the example so that the UL has the CSS property overflow: auto; height: 30px;
Now go over each LI element back and forth over the scrollbar. The LI hover event will not trigger, only the UL hover event triggers.
Attachments (1)
Change History (7)
Changed May 15, 2009 10:36AM UTC by comment:1
Changed September 18, 2009 02:18AM UTC by comment:2
I ran into the same problem:
1. set up a mouse event-handler for a div with 'overflow:scroll'
2. mouse over the scrollbar (I'm on Firefox 3.0.14, Fedora 10, x86_64)
3. Firefox throws a 'permission denied to XULElement.parentNode' error
4. remaining code is not executed
The main issue seems to be that the scrollbar widget (scrollbar + scroll-up/down buttons) are of native XULElement-type in Firefox, and trying to access a property of an object of this type is a no-no (even inside a try-catch block, it seems).
Thanks to the ExtJS-folks though (thanks Condor and mystic), there's a work-around (see http://www.yui-ext.com/forum/showthread.php?p=366482), which fixes the described problem behavior (for me at least).
Here's the verbose code (old code commented out, alternate code w/ original comments inlined):
var withinElement = function(event) { // Check if mouse(over|out) are still within the same parent element var parent = event.relatedTarget; // Traverse up the tree while ( parent && parent != this ) /* // permission denied error if 'parent' is of XULElement-type (which // will happen when mousing over the scrollbar-widget in FF) try { parent = parent.parentNode; } */ // alternate solution: try { // Prevent "Permission denied to get property XXX"-type // errors in Firefox when mousing over // 1) XULElements (e.g. scrollbars, scrollbar buttons etc) // 2) anonymous <DIV>s (i.e. <div class="anonymous-div">) contained in // <INPUT> elements // See https://bugzilla.mozilla.org/show_bug.cgi?id=208427 for more info // tested successfully on: // -- Fx 2.0.0.20 + FB 1.3.1 // -- Fx 3.0.12 / 3.5.1 + FB 1.4.1 // -- Fx 3.0.14 (Fedora 10, 2.6.27.30-170.2.82.fc10.x86_64) + FB 1.4.2 var s = HTMLElement.prototype.toString.call(parent); if (s == '[xpconnect wrapped native prototype]' || // FF 3.5 check s == '[object XULElement]') { // FF < 3.5 check return; } parent = parent.parentNode; } catch(e) { parent = this; } if( parent != this ){ // set the correct event type event.type = event.data; // handle event if we actually just moused on to a non sub-element jQuery.event.handle.apply( this, arguments ); } };
Changed November 17, 2009 12:35PM UTC by comment:3
emparq, thanks for mentioning this workaround. But it didn't work for me until I replaced 'return' with 'break'.
Changed January 09, 2010 06:03PM UTC by comment:4
Does applying this workaround require using the non-minified version of jquery? Can someone post a brief explanation of using the patch?
Thanks!
Changed June 12, 2010 02:24PM UTC by comment:5
component: | unfiled → event |
---|
Changed November 19, 2010 10:17PM UTC by comment:6
resolution: | → worksforme |
---|---|
status: | new → closed |
This doesn’t appear to be an issue in current versions of Firefox + jQuery; please reopen if this is not the case.
It seems to be only Firefox bug, confirmed jQuery 1.2.6+