CODEWITHSUNDEEP
javascriptjquery
Lawrence
Lawrence

Reputation: 845

Using hoverIntent with .on or delegate

How would you use hoverIntent with this:

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

Upvotes: 6

Views: 1172

Answers (3)

hodgef
hodgef

Reputation: 1436

Use the "selector" option for event delegation.

$mainNav.hoverIntent({
        over: function() {

        },
        out: function(){

        },
        selector: '.hEvent'
});

Source: hoverIntent Documentation

Upvotes: 3

kumarharsh
kumarharsh

Reputation: 19609

Actually, it is a bit tricky to use things like 'hover' or 'hoverIntent' directly using delegate(), because hover is not an ACTUAL event, but it is composed of two different events, namely mouseenter, and mouseleave. Therefore, hover is actually a pseudo-event. This information can be found here: http://api.jquery.com/hover/

Now, about handling the pseudo-event: This should work, and the code is also self-explanatory. Suppose you need to bind the 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

Upvotes: 0

scott.korin
scott.korin

Reputation: 2597

.hEvent is being used as the selector, right? The hoverIntent plug-in, from what I understand, has an option called over that takes a function, which is synonymous with the onMouseOver (like the jQuery MouseEnter event).

Wouldn't you be able to use:

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

Upvotes: -1

Related Questions