jQuery - unbind or rebind hoverIntent()?

Question

I have a menu bar that displays a set of categories in an upper row.

One of the categories has a set of sub-categories.

I have a hoverIntent setup so that it

Answer 1

to bind and unbind the hoverIntent you should do:

// bind the hoverIntent
$("#demo1 li").hoverIntent(makeTall, makeShort)
// unbind the hoverIntent
$("#demo1 li").unbind("mouseenter").unbind("mouseleave");
$("#demo1 li").removeProp('hoverIntent_t');
$("#demo1 li").removeProp('hoverIntent_s');
// rebind the hoverIntent
$("#demo1 li").hoverIntent(makeTall, makeShort)

Answer 2

I think this is a more complete answer. It does the following:

• Any active timer is cleaned up.
• All events are cleared
• All object properties are cleared
• Uses common jQuery syntax and looks like native part of hoverIntent

Code:

(function($) {
   if (typeof $.fn.hoverIntent === 'undefined')
     return;

   var rawIntent = $.fn.hoverIntent;

   $.fn.hoverIntent = function(handlerIn,handlerOut,selector) 
    {
      // If called with empty parameter list, disable hoverintent.
      if (typeof handlerIn === 'undefined')
      {
        // Destroy the time if it is present.
        if (typeof this.hoverIntent_t !== 'undefined') 
        { 
          this.hoverIntent_t = clearTimeout(this.hoverIntent_t); 
        }
        // Cleanup all hoverIntent properties on the object.
        delete this.hoverIntent_t;
        delete this.hoverIntent_s;

        // Unbind all of the hoverIntent event handlers.
        this.off('mousemove.hoverIntent,mouseenter.hoverIntent,mouseleave.hoverIntent');

        return this;
      }  

      return rawIntent.apply(this, arguments);
    };  
})(jQuery);

Answer 3

From jQuery docs: "In the simplest case, with no arguments, .unbind() removes all handlers attached to the elements"

Answer 4

I used:

var elements = $("#main_nav li, #breadcrumb_ul li");
elements.unbind('mouseover mouseout');
delete $(elements).hoverIntent_t;
delete $(elements).hoverIntent_s;