title: Detect mouse on touch screen device
body: <p>I use the following code to detect whether the device is a touch device or not:</p>
  
  <pre><code>var isTouchDevice = 'ontouchstart' in window || navigator.msMaxTouchPoints;
  
  if(isTouchDevice)
  {
      $('body').addClass('yes-touch');
  }
  else
  {
      $('body').addClass('no-touch');
  }
  </code></pre>
  
  <p>I use this to only show <code>:hover</code> states when it is NOT a touch device (as most touch devices interpret a tap as a hover).</p>
  
  <pre><code>.no-touch .element:hover {
      color: red;
  }
  </code></pre>
  
  <p>The problem is, one of our PCs in the office is an all-on-one touch screen PC, which means that when using a mouse the hover states don't occur.</p>
  
  <p>Is there a way to work out whether a mouse is being used on a touch screen device? In other words, it should have the <code>no-touch</code> class applied when the mouse is being used and the <code>yes-touch</code> class applied when the touch screen is being used.</p>