Added focus/blur handling as an option

Author: Solant

dist/hoverintent.min.js

@@ -10,15 +10,15 @@
 <div class='fixed-700'>
   <p class='intro'>Sometimes you want to limit when a mouse event is fired if a user has unintentionaly hovered over an element. <a href='https://github.com/tristen/hoverintent'>hoverintent</a> tracks the sensitivity of a mouse position and fires an event within a threshold. You can also pass additional options that adjusts when an event is triggered. <a href='https://raw.github.com/tristen/hoverintent/gh-pages/dist/hoverintent.min.js'>Download the source</a> and read its <a href='https://github.com/tristen/hoverintent#hoverintent'>usage on GitHub.</a></p>
   <ul class='examples'>
-    <li id='first'>
+    <li id='first' tabindex="0">
       Plain old hover
       <span class='popup'>Hi there</span>
     </li>
-    <li id='second'>
+    <li id='second' tabindex="0">
       hoverintent
       <span class='popup'>Hi there</span>
     </li>
-    <li id='third'>
+    <li id='third' tabindex="0">
       Custom settings
       <span class='popup'>Hi there</span>
     </li>
@@ -64,7 +64,8 @@
   }, function(e) {
     this.className = 'off';
   }).options({
-    timeout:500
+    timeout:500,
+    handleFocus: true
   });
 
 var analytics=analytics||[];(function(){var e=["identify","track","trackLink","trackForm","trackClick","trackSubmit","page","pageview","ab","alias","ready","group"],t=function(e){return function(){analytics.push([e].concat(Array.prototype.slice.call(arguments,0)))}};for(var n=0;n<e.length;n++)analytics[e[n]]=t(e[n])})(),analytics.load=function(e){var t=document.createElement("script");t.type="text/javascript",t.async=!0,t.src=("https:"===document.location.protocol?"https://":"http://")+"d2dq2ahtl5zl1z.cloudfront.net/analytics.js/v1/"+e+"/analytics.min.js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(t,n)};

index.html

@@ -2,14 +2,16 @@
 
 module.exports = function(el, onOver, onOut) {
   var x, y, pX, pY;
+  var mouseOver = false;
   var h = {},
     state = 0,
     timer = 0;
 
   var options = {
     sensitivity: 7,
     interval: 100,
-    timeout: 0
+    timeout: 0,
+    handleFocus: false
   };
 
   function delay(el, e) {
@@ -39,11 +41,16 @@ module.exports = function(el, onOver, onOut) {
 
   // Public methods
   h.options = function(opt) {
+    var focusOptionChanged = opt.handleFocus !== options.handleFocus;
     options = Object.assign({}, options, opt);
+    if (focusOptionChanged) {
+      options.handleFocus ? addFocus() : removeFocus();
+    }
     return h;
   };
 
   function dispatchOver(e) {
+    mouseOver = true;
     if (timer) timer = clearTimeout(timer);
     el.removeEventListener('mousemove', tracker, false);
 
@@ -62,6 +69,7 @@ module.exports = function(el, onOver, onOut) {
   }
 
   function dispatchOut(e) {
+    mouseOver = false;
     if (timer) timer = clearTimeout(timer);
     el.removeEventListener('mousemove', tracker, false);
 
@@ -74,10 +82,33 @@ module.exports = function(el, onOver, onOut) {
     return this;
   }
 
+  function dispatchFocus(e) {
+    if (!mouseOver) {
+      onOver.call(el, e);
+    }
+  }
+
+  function dispatchBlur(e) {
+    if (!mouseOver) {
+      onOut.call(el, e);
+    }
+  }
+
+  function addFocus() {
+    el.addEventListener('focus', dispatchFocus, false);
+    el.addEventListener('blur', dispatchBlur, false);
+  }
+
+  function removeFocus() {
+    el.removeEventListener('focus', dispatchFocus, false);
+    el.removeEventListener('blur', dispatchBlur, false);
+  }
+
   h.remove = function() {
     if (!el) return;
     el.removeEventListener('mouseover', dispatchOver, false);
     el.removeEventListener('mouseout', dispatchOut, false);
+    removeFocus();
   };
 
   if (el) {