How can I tell the difference between click events and swipe events in JavaScript?

Question

I am using OnsenUI 2 with ReactJS for developing a Cross-Platform App with Cordova. It should run on mobile devices, but it would be nice if it works on normal browsers too. I have a Carousel Element with full screen images and when the user taps on the image I want to open a new page. The problem is, that every swipe to a new image is triggering a click event on the image. How can I tell the difference between a tap on the slide and a swipe to the new slide?

Codepen: https://codepen.io/anon/pen/amJooZ

Answer 1

If you're developing something for a touch screen, instead of listening for click events, you should listen for touch events. See MDN's documentation of touch events . If it's important to handle normal click events as well, see the section about handling clicks .