Question

since I’ve upgraded to jQuery 1.7, the hoverIntent event does not work anymore on UI Tabs. Since jQuery 1.7, the tab switches instantly instead of using hoverIntent.

Here is the code, I used to initialize UI Tabs:

$("#featured").tabs({event: "hoverintent"}).tabs({fx:{opacity: "toggle", duration: 250}}).tabs("rotate", 7000, true);
      $("#featured").hover(  
        function() {  
          $("#featured").tabs("rotate",0,true);  
        },  
        function() {  
          $("#featured").tabs("rotate",7000,true);  
        }  
    );

This is the js for hoverIntent event I included in my page:

var cfg = ($.hoverintent = {
  sensitivity: 7,
  interval: 100
});

$.event.special.hoverintent = {
  setup: function() {
    $(this).bind("mouseover", jQuery.event.special.hoverintent.handler);
  },
  teardown: function() {
    $(this).unbind("mouseover", jQuery.event.special.hoverintent.handler);
  },
  handler: function(event) {
    event.type = "hoverintent";
    var self = this,
      args = arguments,
      target = $(event.target),
      cX, cY, pX, pY;


    function track(event) {
      cX = event.pageX;
      cY = event.pageY;
    };
    pX = event.pageX;
    pY = event.pageY;
    function clear() {
      target.unbind("mousemove", track).unbind("mouseout", arguments.callee);
      clearTimeout(timeout);
    }
    function handler() {
      if ( ( Math.abs(pX-cX) + Math.abs(pY-cY) ) < cfg.sensitivity ) {
        clear();
        jQuery.event.handle.apply(self, args);
      } else {
        pX = cX; pY = cY;
        timeout = setTimeout(handler, cfg.interval);
      }
    }
    var timeout = setTimeout(handler, cfg.interval);
    target.mousemove(track).mouseout(clear);
    return true;
  }
};

There seems to be a fix (for UI Accordion though) here: https://github.com/jquery/jquery-ui/commit/f0f54e38d8eab613d7ea25d698b81126e5263d83#diff-0

See demo: http://jqueryui.com/demos/accordion/hoverintent.html

However, I’m not sure, how to get hoverIntent working again. What changes have to be made to the code above? Glad for any help!

Answer 1

Updating jQuery to v1.7.1 solved the problem.