home *** CD-ROM | disk | FTP | other *** search
/ HTML Examples / WP.iso / wordpress / wp-includes / js / hoverIntent.js < prev    next >
Encoding:
JavaScript  |  2015-03-11  |  4.8 KB  |  116 lines
  1. /*!
  2.  * hoverIntent v1.8.1 // 2014.08.11 // jQuery v1.9.1+
  3.  * http://cherne.net/brian/resources/jquery.hoverIntent.html
  4.  *
  5.  * You may use hoverIntent under the terms of the MIT license. Basically that
  6.  * means you are free to use hoverIntent as long as this header is left intact.
  7.  * Copyright 2007, 2014 Brian Cherne
  8.  */
  9.  
  10. /* hoverIntent is similar to jQuery's built-in "hover" method except that
  11.  * instead of firing the handlerIn function immediately, hoverIntent checks
  12.  * to see if the user's mouse has slowed down (beneath the sensitivity
  13.  * threshold) before firing the event. The handlerOut function is only
  14.  * called after a matching handlerIn.
  15.  *
  16.  * // basic usage ... just like .hover()
  17.  * .hoverIntent( handlerIn, handlerOut )
  18.  * .hoverIntent( handlerInOut )
  19.  *
  20.  * // basic usage ... with event delegation!
  21.  * .hoverIntent( handlerIn, handlerOut, selector )
  22.  * .hoverIntent( handlerInOut, selector )
  23.  *
  24.  * // using a basic configuration object
  25.  * .hoverIntent( config )
  26.  *
  27.  * @param  handlerIn   function OR configuration object
  28.  * @param  handlerOut  function OR selector for delegation OR undefined
  29.  * @param  selector    selector OR undefined
  30.  * @author Brian Cherne <brian(at)cherne(dot)net>
  31.  */
  32. (function($) {
  33.     $.fn.hoverIntent = function(handlerIn,handlerOut,selector) {
  34.  
  35.         // default configuration values
  36.         var cfg = {
  37.             interval: 100,
  38.             sensitivity: 6,
  39.             timeout: 0
  40.         };
  41.  
  42.         if ( typeof handlerIn === "object" ) {
  43.             cfg = $.extend(cfg, handlerIn );
  44.         } else if ($.isFunction(handlerOut)) {
  45.             cfg = $.extend(cfg, { over: handlerIn, out: handlerOut, selector: selector } );
  46.         } else {
  47.             cfg = $.extend(cfg, { over: handlerIn, out: handlerIn, selector: handlerOut } );
  48.         }
  49.  
  50.         // instantiate variables
  51.         // cX, cY = current X and Y position of mouse, updated by mousemove event
  52.         // pX, pY = previous X and Y position of mouse, set by mouseover and polling interval
  53.         var cX, cY, pX, pY;
  54.  
  55.         // A private function for getting mouse position
  56.         var track = function(ev) {
  57.             cX = ev.pageX;
  58.             cY = ev.pageY;
  59.         };
  60.  
  61.         // A private function for comparing current and previous mouse position
  62.         var compare = function(ev,ob) {
  63.             ob.hoverIntent_t = clearTimeout(ob.hoverIntent_t);
  64.             // compare mouse positions to see if they've crossed the threshold
  65.             if ( Math.sqrt( (pX-cX)*(pX-cX) + (pY-cY)*(pY-cY) ) < cfg.sensitivity ) {
  66.                 $(ob).off("mousemove.hoverIntent",track);
  67.                 // set hoverIntent state to true (so mouseOut can be called)
  68.                 ob.hoverIntent_s = true;
  69.                 return cfg.over.apply(ob,[ev]);
  70.             } else {
  71.                 // set previous coordinates for next time
  72.                 pX = cX; pY = cY;
  73.                 // use self-calling timeout, guarantees intervals are spaced out properly (avoids JavaScript timer bugs)
  74.                 ob.hoverIntent_t = setTimeout( function(){compare(ev, ob);} , cfg.interval );
  75.             }
  76.         };
  77.  
  78.         // A private function for delaying the mouseOut function
  79.         var delay = function(ev,ob) {
  80.             ob.hoverIntent_t = clearTimeout(ob.hoverIntent_t);
  81.             ob.hoverIntent_s = false;
  82.             return cfg.out.apply(ob,[ev]);
  83.         };
  84.  
  85.         // A private function for handling mouse 'hovering'
  86.         var handleHover = function(e) {
  87.             // copy objects to be passed into t (required for event object to be passed in IE)
  88.             var ev = $.extend({},e);
  89.             var ob = this;
  90.  
  91.             // cancel hoverIntent timer if it exists
  92.             if (ob.hoverIntent_t) { ob.hoverIntent_t = clearTimeout(ob.hoverIntent_t); }
  93.  
  94.             // if e.type === "mouseenter"
  95.             if (e.type === "mouseenter") {
  96.                 // set "previous" X and Y position based on initial entry point
  97.                 pX = ev.pageX; pY = ev.pageY;
  98.                 // update "current" X and Y position based on mousemove
  99.                 $(ob).on("mousemove.hoverIntent",track);
  100.                 // start polling interval (self-calling timeout) to compare mouse coordinates over time
  101.                 if (!ob.hoverIntent_s) { ob.hoverIntent_t = setTimeout( function(){compare(ev,ob);} , cfg.interval );}
  102.  
  103.                 // else e.type == "mouseleave"
  104.             } else {
  105.                 // unbind expensive mousemove event
  106.                 $(ob).off("mousemove.hoverIntent",track);
  107.                 // if hoverIntent state is true, then call the mouseOut function after the specified delay
  108.                 if (ob.hoverIntent_s) { ob.hoverIntent_t = setTimeout( function(){delay(ev,ob);} , cfg.timeout );}
  109.             }
  110.         };
  111.  
  112.         // listen for mouseenter and mouseleave
  113.         return this.on({'mouseenter.hoverIntent':handleHover,'mouseleave.hoverIntent':handleHover}, cfg.selector);
  114.     };
  115. })(jQuery);
  116.