Jquery Swipe without jQuery mobile library

jquery touch swipe
Alan A picture Alan A · Jan 29, 2014 · Viewed 19.7k times · Source

I know that this subject has been covered extensively on Stackoverflow but I cannot find a definitive answer.

I am successfully detecting if the client device is a touch screen:

if(!!('ontouchstart' in window)){

     // detect swipe

}

However, I cannot figure out how to detect a swipe/hover over an element. Please note that I want to be able to do this without the jquery mobile library.

Here is my fiddle:

http://jsfiddle.net/k77aC/9/

Thank you in advance,

Alan.

Answer

Paul Asjes picture Paul Asjes · Jan 29, 2014

If it's just jQuery mobile which you don't want to use, try hammer js which is lightweight and has a lot of options.

If however you're completely opposed to using any library at all have a look at the different touch events available:

https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Touch_events

Related questions

Detect left/right-swipe on touch-devices, but allow up/down-scrolling

I need to detect and react to left/right-swipes, but want to give the user the ability to scroll on the same element, so as long as he moves his finger only left/right with a maximum up/down movement …

Read More
What's the best way to detect a 'touch screen' device using JavaScript?

I've written a jQuery plug-in that's for use on both desktop and mobile devices. I wondered if there is a way with JavaScript to detect if the device has touch screen capability. I'm using jquery-mobile.js to detect the touch …

Read More
Consider marking event handler as 'passive' to make the page more responsive

I am using hammer for dragging and it is getting choppy when loading other stuff, as this warning message is telling me. Handling of 'touchstart' input event was delayed for X ms due to main thread being busy. Consider marking …

Read More