Switch hover/touch events for Desktop/mobile devices

/ Published in: JavaScript
Save to your folder(s)

Hover events can be irrelevant on mobile devices relying on touch events.
This script switches the classical desktop hover events to touch events.

Inspired by: http://jbkflex.wordpress.com/2012/07/12/javascript-touch-event-or-mouse-event-detect-and-handle-according-to-device/

Copy this code and paste it in your HTML
  1. var isTouchSupported = 'ontouchstart' in window;
  2. var startEvent = isTouchSupported ? 'touchstart' : 'mouseenter';
  3. var endEvent = isTouchSupported ? 'touchend' : 'mouseleave';
  5. $('.yourclass').on(startEvent,function(){
  6. doSomething(this);
  7. });
  9. $('.yourclass').on(endEvent,function(){
  10. doSomething(this);
  11. });

Report this snippet


RSS Icon Subscribe to comments

You need to login to post a comment.