Skip to content

Instantly share code, notes, and snippets.

@wiesys
Forked from SleepWalker/swipe.js
Last active March 9, 2021 03:12
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save wiesys/8750649d1dd0f5b02d63add3096733cf to your computer and use it in GitHub Desktop.
Save wiesys/8750649d1dd0f5b02d63add3096733cf to your computer and use it in GitHub Desktop.
A simple swipe detection on vanilla js
var touchstartX = 0;
var touchstartY = 0;
var touchendX = 0;
var touchendY = 0;
var gesuredZone = document.getElementById('gesuredZone');
gesuredZone.addEventListener('touchstart', function(event) {
touchstartX = event.changedTouches[0].pageX;
touchstartY = event.changedTouches[0].pageY;
}, false);
gesuredZone.addEventListener('touchend', function(event) {
touchendX = event.changedTouches[0].pageX;
touchendY = event.changedTouches[0].pageY;
handleGesure();
}, false);
function handleGesure() {
var swiped = 'swiped: ';
if (touchendX < touchstartX) {
alert(swiped + 'left!');
}
if (touchendX > touchstartX) {
alert(swiped + 'right!');
}
if (touchendY < touchstartY) {
alert(swiped + 'down!');
}
if (touchendY > touchstartY) {
alert(swiped + 'left!');
}
if (touchendY == touchstartY) {
alert('tap!');
}
}
@shatner
Copy link

shatner commented Sep 25, 2016

This fixed it for me -- thanks!

@dranets13
Copy link

Thanks, this help me to!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment