Jquery Swipe without jQuery mobile library

Question

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.

Solution

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

Comments

[Alan A]

Thanks hammer.js looks perfect for my needs!

[Alan A]

I don't seem to be able to detect a swipe or tap using hammer.js: $('.myElement').hammer().on("tap", ".nested_el", function(event) { alert('yes'); });

[Alan A]

I fixed it by referencing the id rather than the class