Modify ↓
Ticket #1970 (closed bug: fixed)
hover in Opera disables changes in cursor icon
| Reported by: | nene | Owned by: | davidserduke |
|---|---|---|---|
| Priority: | minor | Milestone: | 1.2.2 |
| Component: | core | Version: | 1.2.1 |
| Keywords: | Cc: | ||
| Blocking: | Blocked by: |
Description (last modified by davidserduke) (diff)
When using any hover effect, even an empty one like this:
$(function(){
$("li").hover( function () {/* nothing */}, function () {/* nothing */} );
});
On HTML like this:
<ul> <li><a href="#">Hello</a> world!</li> <li><a href="#">Hello</a> world!</li> <li><a href="#">Hello</a> world!</li> </ul>
then, when hovering cursor from non-link content to link, the cursor does not change shape. It should change from simple arrow to pointing hand, but does not.
This happens only in Opera (tried both Windows and Linux versions).
Simple solution: hover() should return true instead of false when moused over a sub-element.
Example fix:
jQuery.fn.extend({
hover: function(f,g) {
// A private function for handling mouse 'hovering'
function handleHover(e) {
// Check if mouse(over|out) are still within the same parent element
var p = e.relatedTarget;
// Traverse up the tree
while ( p && p != this ) try { p = p.parentNode; } catch(e) { p = this; };
// If we actually just moused on to a sub-element, ignore it
if ( p == this ) return true; // this was previously FALSE
// Execute the right function
return (e.type == "mouseover" ? f : g).apply(this, [e]);
}
// Bind the function to the two event listeners
return this.mouseover(handleHover).mouseout(handleHover);
}
});
Change History
Please follow the bug reporting guidlines and use jsFiddle when providing test cases and demonstrations instead of pasting the code in the ticket.
Note: See
TracTickets for help on using
tickets.

Damn... I just tried out the formatting options and mistakenly hit the submit button. The last code should look like this:
jQuery.fn.extend({ hover: function(f,g) { // A private function for handling mouse 'hovering' function handleHover(e) { // Check if mouse(over|out) are still within the same parent element var p = e.relatedTarget; // Traverse up the tree while ( p && p != this ) try { p = p.parentNode; } catch(e) { p = this; }; // If we actually just moused on to a sub-element, ignore it if ( p == this ) return true; // this was previously FALSE // Execute the right function return (e.type == "mouseover" ? f : g).apply(this, [e]); } // Bind the function to the two event listeners return this.mouseover(handleHover).mouseout(handleHover); } });