jQuery's 'hover' trigger doesn't seem to work. My code is simple:

<div id='el'>Content</div>

// does not work
$('#el').on('hover', function() { console.log('is not triggered'); });
$('#el').trigger('hover');

// works for various strings: 'foo', 'click', 'hove', 'keyup', etc.
$('#el').on('foo', function() { console.log('is triggered'); });
$('#el').trigger('foo');

Any handler I bind to this div with .on responds to .trigger except for the 'hover' event. A handler bound with .on('hover', handler) does respond to me manually hovering on the element, but it does not respond to programmatic triggers. I've tested this in both Chrome and Firefox.

Any ideas? Is this a bug in jQuery?

jQuery's 'hover' trigger doesn't seem to work. My code is simple:

<div id='el'>Content</div>

// does not work
$('#el').on('hover', function() { console.log('is not triggered'); });
$('#el').trigger('hover');

// works for various strings: 'foo', 'click', 'hove', 'keyup', etc.
$('#el').on('foo', function() { console.log('is triggered'); });
$('#el').trigger('foo');

Any handler I bind to this div with .on responds to .trigger except for the 'hover' event. A handler bound with .on('hover', handler) does respond to me manually hovering on the element, but it does not respond to programmatic triggers. I've tested this in both Chrome and Firefox.

Any ideas? Is this a bug in jQuery?

• javascript
• jquery

• 4 Works fine here: jsfiddle/PSS4x – Tats_innit Commented Oct 19, 2012 at 2:25
• dont forget the <script> tag – yodog Commented Oct 19, 2012 at 2:26
• 1 @Tats_innit that works but it doesn't work onload. At least for my browser. – Steven Commented Oct 19, 2012 at 2:27
• @Tats_innit: Your demo doesn't work for me, but works when you use the underlying events. – I Hate Lazy Commented Oct 19, 2012 at 2:28
• 1 possible duplicate of jQuery: Automatically trigger hover – Felix Kling Commented Oct 19, 2012 at 2:33

2 Answers 2

Trigger the 'mouseenter' or 'mouseleave' events.

The 'hover' syntax is a jQuery shortcut for binding 'mouseenter' and 'mouseleave'.

You can't trigger CSS pseudo selectors with jQuery. But you can do anything else, such as create a function and have that triggered.