Using hoverIntent with .on or delgate

Question

How would you use hoverIntent with this:

$mainNav.on('mouseenter', '.hEvent', function () { //Do stuff }); 

Answer 1

Use the selector option to delegate events.

 $mainNav.hoverIntent({ over: function() { }, out: function(){ }, selector: '.hEvent' }); 

Source: hoverIntent documentation

Answer 2

In fact, it’s a little difficult to use things like “hover” or “hoverIntent” directly using delegate (), because hovering is not an ACTUAL event, but it consists of two different events: mouseenter and mouseleave . Therefore, the freeze is actually a pseudo-event. This information can be found here: http://api.jquery.com/hover/

Now about handling pseudo-events: This should work, and the code also needs no explanation. Suppose you need to bind hoverIntent to #child

  $('#parent').delegate( '#child', 'hoverIntent', function (evt) { if (evt.type === 'mouseenter') $(this).find('.tooltip').fadeIn(); else $(this).find('.tooltip').hide(); }); 

Hope this helps .: D

Answer 3

.hEvent is used as a selector, right? The hoverIntent plugin, from what I understand, has a parameter called over , which takes a function that is synonymous with onMouseOver (for example, the jQuery MouseEnter event).

Could you use:

 $(".hEvent").hoverIntent(over: function() { //Do stuff });