/******************************************************************************* jquery.mb.components copyright (c) 2001-2010. matteo bicocchi (pupunzi); open lab srl, firenze - italy email: info@pupunzi.com site: http://pupunzi.com licences: mit, gpl http://www.opensource.org/licenses/mit-license.php http://www.gnu.org/licenses/gpl.html ******************************************************************************/ /** * hoverintent is similar to jquery's built-in "hover" function except that * instead of firing the onmouseover event immediately, hoverintent checks * to see if the user's mouse has slowed down (beneath the sensitivity * threshold) before firing the onmouseover event. * * hoverintent r5 // 2007.03.27 // jquery 1.1.2+ * * * hoverintent is currently available for use in all personal or commercial * projects under both mit and gpl licenses. this means that you can choose * the license that best suits your project, and use it accordingly. * * // basic usage (just like .hover) receives onmouseover and onmouseout functions * $("ul li").hoverintent( shownav , hidenav ); * * // advanced usage receives configuration object only * $("ul li").hoverintent({ * sensitivity: 7, // number = sensitivity threshold (must be 1 or higher) * interval: 100, // number = milliseconds of polling interval * over: shownav, // function = onmouseover callback (required) * timeout: 0, // number = milliseconds delay before onmouseout function call * out: hidenav // function = onmouseout callback (required) * }); * * @param f onmouseover function || an object with configuration options * @param g onmouseout function || nothing (use configuration options object) * @author brian cherne */ (function($) { $.fn.hoverintent = function(f,g) { // default configuration options var cfg = { sensitivity: 7, interval: 100, timeout: 0 }; // override configuration options with user supplied object cfg = $.extend(cfg, g ? { over: f, out: g } : f ); // instantiate variables // cx, cy = current x and y position of mouse, updated by mousemove event // px, py = previous x and y position of mouse, set by mouseover and polling interval var cx, cy, px, py; // a private function for getting mouse position var track = function(ev) { cx = ev.pagex; cy = ev.pagey; }; // a private function for comparing current and previous mouse position var compare = function(ev,ob) { ob.hoverintent_t = cleartimeout(ob.hoverintent_t); // compare mouse positions to see if they've crossed the threshold if ( ( math.abs(px-cx) + math.abs(py-cy) ) < cfg.sensitivity ) { $(ob).unbind("mousemove",track); // set hoverintent state to true (so mouseout can be called) ob.hoverintent_s = 1; return cfg.over.apply(ob,[ev]); } else { // set previous coordinates for next time px = cx; py = cy; // use self-calling timeout, guarantees intervals are spaced out properly (avoids javascript timer bugs) ob.hoverintent_t = settimeout( function(){compare(ev, ob);} , cfg.interval ); } }; // a private function for delaying the mouseout function var delay = function(ev,ob) { ob.hoverintent_t = cleartimeout(ob.hoverintent_t); ob.hoverintent_s = 0; return cfg.out.apply(ob,[ev]); }; // a private function for handling mouse 'hovering' var handlehover = function(e) { // next three lines copied from jquery.hover, ignore children onmouseover/onmouseout var p = (e.type == "mouseover" ? e.fromelement : e.toelement) || e.relatedtarget; while ( p && p != this ) { try { p = p.parentnode; } catch(e) { p = this; } } if ( p == this ) { return false; } // copy objects to be passed into t (required for event object to be passed in ie) var ev = jquery.extend({},e); var ob = this; // cancel hoverintent timer if it exists if (ob.hoverintent_t) { ob.hoverintent_t = cleartimeout(ob.hoverintent_t); } // else e.type == "onmouseover" if (e.type == "mouseover") { // set "previous" x and y position based on initial entry point px = ev.pagex; py = ev.pagey; // update "current" x and y position based on mousemove $(ob).bind("mousemove",track); // start polling interval (self-calling timeout) to compare mouse coordinates over time if (ob.hoverintent_s != 1) { ob.hoverintent_t = settimeout( function(){compare(ev,ob);} , cfg.interval );} // else e.type == "onmouseout" } else { // unbind expensive mousemove event $(ob).unbind("mousemove",track); // if hoverintent state is true, then call the mouseout function after the specified delay if (ob.hoverintent_s == 1) { ob.hoverintent_t = settimeout( function(){delay(ev,ob);} , cfg.timeout );} } }; // bind the function to the two event listeners return this.mouseover(handlehover).mouseout(handlehover); }; })(jquery);