Skip to content

Instantly share code, notes, and snippets.

@TheArtifulProgrammer
Forked from SleepWalker/swipe.js
Created September 20, 2022 11:29
Show Gist options
  • Save TheArtifulProgrammer/a604af655114c30ee87d73fc621336be to your computer and use it in GitHub Desktop.
Save TheArtifulProgrammer/a604af655114c30ee87d73fc621336be 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.screenX;
touchstartY = event.screenY;
}, false);
gesuredZone.addEventListener('touchend', function(event) {
touchendX = event.screenX;
touchendY = event.screenY;
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!');
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment