mp-wp_genesis 1 /**
mp-wp_genesis 2 * hoverIntent is similar to jQuery's built-in "hover" function except that
mp-wp_genesis 3 * instead of firing the onMouseOver event immediately, hoverIntent checks
mp-wp_genesis 4 * to see if the user's mouse has slowed down (beneath the sensitivity
mp-wp_genesis 5 * threshold) before firing the onMouseOver event.
mp-wp_genesis 6 *
mp-wp_genesis 7 * hoverIntent r5 // 2007.03.27 // jQuery 1.1.2+
mp-wp_genesis 8 * <http://cherne.net/brian/resources/jquery.hoverIntent.html>
mp-wp_genesis 9 *
mp-wp_genesis 10 * hoverIntent is currently available for use in all personal or commercial
mp-wp_genesis 11 * projects under both MIT and GPL licenses. This means that you can choose
mp-wp_genesis 12 * the license that best suits your project, and use it accordingly.
mp-wp_genesis 13 *
mp-wp_genesis 14 * // basic usage (just like .hover) receives onMouseOver and onMouseOut functions
mp-wp_genesis 15 * $("ul li").hoverIntent( showNav , hideNav );
mp-wp_genesis 16 *
mp-wp_genesis 17 * // advanced usage receives configuration object only
mp-wp_genesis 18 * $("ul li").hoverIntent({
mp-wp_genesis 19 * sensitivity: 7, // number = sensitivity threshold (must be 1 or higher)
mp-wp_genesis 20 * interval: 100, // number = milliseconds of polling interval
mp-wp_genesis 21 * over: showNav, // function = onMouseOver callback (required)
mp-wp_genesis 22 * timeout: 0, // number = milliseconds delay before onMouseOut function call
mp-wp_genesis 23 * out: hideNav // function = onMouseOut callback (required)
mp-wp_genesis 24 * });
mp-wp_genesis 25 *
mp-wp_genesis 26 * @param f onMouseOver function || An object with configuration options
mp-wp_genesis 27 * @param g onMouseOut function || Nothing (use configuration options object)
mp-wp_genesis 28 * @author Brian Cherne <brian@cherne.net>
mp-wp_genesis 29 */
mp-wp_genesis 30 (function($) {
mp-wp_genesis 31 $.fn.hoverIntent = function(f,g) {
mp-wp_genesis 32 // default configuration options
mp-wp_genesis 33 var cfg = {
mp-wp_genesis 34 sensitivity: 7,
mp-wp_genesis 35 interval: 100,
mp-wp_genesis 36 timeout: 0
mp-wp_genesis 37 };
mp-wp_genesis 38 // override configuration options with user supplied object
mp-wp_genesis 39 cfg = $.extend(cfg, g ? { over: f, out: g } : f );
mp-wp_genesis 40
mp-wp_genesis 41 // instantiate variables
mp-wp_genesis 42 // cX, cY = current X and Y position of mouse, updated by mousemove event
mp-wp_genesis 43 // pX, pY = previous X and Y position of mouse, set by mouseover and polling interval
mp-wp_genesis 44 var cX, cY, pX, pY;
mp-wp_genesis 45
mp-wp_genesis 46 // A private function for getting mouse position
mp-wp_genesis 47 var track = function(ev) {
mp-wp_genesis 48 cX = ev.pageX;
mp-wp_genesis 49 cY = ev.pageY;
mp-wp_genesis 50 };
mp-wp_genesis 51
mp-wp_genesis 52 // A private function for comparing current and previous mouse position
mp-wp_genesis 53 var compare = function(ev,ob) {
mp-wp_genesis 54 ob.hoverIntent_t = clearTimeout(ob.hoverIntent_t);
mp-wp_genesis 55 // compare mouse positions to see if they've crossed the threshold
mp-wp_genesis 56 if ( ( Math.abs(pX-cX) + Math.abs(pY-cY) ) < cfg.sensitivity ) {
mp-wp_genesis 57 $(ob).unbind("mousemove",track);
mp-wp_genesis 58 // set hoverIntent state to true (so mouseOut can be called)
mp-wp_genesis 59 ob.hoverIntent_s = 1;
mp-wp_genesis 60 return cfg.over.apply(ob,[ev]);
mp-wp_genesis 61 } else {
mp-wp_genesis 62 // set previous coordinates for next time
mp-wp_genesis 63 pX = cX; pY = cY;
mp-wp_genesis 64 // use self-calling timeout, guarantees intervals are spaced out properly (avoids JavaScript timer bugs)
mp-wp_genesis 65 ob.hoverIntent_t = setTimeout( function(){compare(ev, ob);} , cfg.interval );
mp-wp_genesis 66 }
mp-wp_genesis 67 };
mp-wp_genesis 68
mp-wp_genesis 69 // A private function for delaying the mouseOut function
mp-wp_genesis 70 var delay = function(ev,ob) {
mp-wp_genesis 71 ob.hoverIntent_t = clearTimeout(ob.hoverIntent_t);
mp-wp_genesis 72 ob.hoverIntent_s = 0;
mp-wp_genesis 73 return cfg.out.apply(ob,[ev]);
mp-wp_genesis 74 };
mp-wp_genesis 75
mp-wp_genesis 76 // workaround for Mozilla bug: not firing mouseout/mouseleave on absolute positioned elements over textareas and input type="text"
mp-wp_genesis 77 var handleHover = function(e) {
mp-wp_genesis 78 var t = this;
mp-wp_genesis 79
mp-wp_genesis 80 // next two lines copied from jQuery.hover, ignore children onMouseOver/onMouseOut
mp-wp_genesis 81 var p = (e.type == "mouseover" ? e.fromElement : e.toElement) || e.relatedTarget;
mp-wp_genesis 82 while ( p && p != this ) { try { p = p.parentNode; } catch(e) { p = this; } }
mp-wp_genesis 83 if ( p == this ) {
mp-wp_genesis 84 if ( $.browser.mozilla ) {
mp-wp_genesis 85 if ( e.type == "mouseout" ) {
mp-wp_genesis 86 t.mtout = setTimeout( function(){doHover(e,t);}, 30 );
mp-wp_genesis 87 } else {
mp-wp_genesis 88 if (t.mtout) { t.mtout = clearTimeout(t.mtout); }
mp-wp_genesis 89 }
mp-wp_genesis 90 }
mp-wp_genesis 91 return;
mp-wp_genesis 92 } else {
mp-wp_genesis 93 if (t.mtout) { t.mtout = clearTimeout(t.mtout); }
mp-wp_genesis 94 doHover(e,t);
mp-wp_genesis 95 }
mp-wp_genesis 96 };
mp-wp_genesis 97
mp-wp_genesis 98 // A private function for handling mouse 'hovering'
mp-wp_genesis 99 var doHover = function(e,ob) {
mp-wp_genesis 100
mp-wp_genesis 101 // copy objects to be passed into t (required for event object to be passed in IE)
mp-wp_genesis 102 var ev = jQuery.extend({},e);
mp-wp_genesis 103
mp-wp_genesis 104 // cancel hoverIntent timer if it exists
mp-wp_genesis 105 if (ob.hoverIntent_t) { ob.hoverIntent_t = clearTimeout(ob.hoverIntent_t); }
mp-wp_genesis 106
mp-wp_genesis 107 // else e.type == "onmouseover"
mp-wp_genesis 108 if (e.type == "mouseover") {
mp-wp_genesis 109 // set "previous" X and Y position based on initial entry point
mp-wp_genesis 110 pX = ev.pageX; pY = ev.pageY;
mp-wp_genesis 111 // update "current" X and Y position based on mousemove
mp-wp_genesis 112 $(ob).bind("mousemove",track);
mp-wp_genesis 113 // start polling interval (self-calling timeout) to compare mouse coordinates over time
mp-wp_genesis 114 if (ob.hoverIntent_s != 1) { ob.hoverIntent_t = setTimeout( function(){compare(ev,ob);} , cfg.interval );}
mp-wp_genesis 115
mp-wp_genesis 116 // else e.type == "onmouseout"
mp-wp_genesis 117 } else {
mp-wp_genesis 118 // unbind expensive mousemove event
mp-wp_genesis 119 $(ob).unbind("mousemove",track);
mp-wp_genesis 120 // if hoverIntent state is true, then call the mouseOut function after the specified delay
mp-wp_genesis 121 if (ob.hoverIntent_s == 1) { ob.hoverIntent_t = setTimeout( function(){delay(ev,ob);} , cfg.timeout );}
mp-wp_genesis 122 }
mp-wp_genesis 123 };
mp-wp_genesis 124
mp-wp_genesis 125 // bind the function to the two event listeners
mp-wp_genesis 126 return this.mouseover(handleHover).mouseout(handleHover);
mp-wp_genesis 127 };
mp-wp_genesis 128 })(jQuery);