I have a web app of several divisions 320x460 divisions. I want to use a swipe gesture to slide through the divisions. I got this to work but there is an issue with the way I'm handling the events.
When I put my finger on the screen a touchStart event is initiated.
As I drag my finger across the screen touchMove events happen and when I lift my finger a touchEnd event happens.
The problem I am running into is when dragging your finger I want to cancel the intial "touchStart" event from triggering any time that it turns into a drag over 50 pixels long.
What is happening is that when I put my finger down on a button in the page and pause before dragging, that button gets clicked. If I don't pause after putting my finger down and quickly flick the butten gets clicked after I finish the flick. What ends up happening when I'm using drags to slide divisions in and out of view is that if I flick quickly the incoming division receives a mousedown/click event right where I started my flick on the division that is sliding out.
http://scores.warbirdsiii.com/imote/index.html
I've got these three lines in the head to trap events
When I put my finger on the screen a touchStart event is initiated.
As I drag my finger across the screen touchMove events happen and when I lift my finger a touchEnd event happens.
The problem I am running into is when dragging your finger I want to cancel the intial "touchStart" event from triggering any time that it turns into a drag over 50 pixels long.
What is happening is that when I put my finger down on a button in the page and pause before dragging, that button gets clicked. If I don't pause after putting my finger down and quickly flick the butten gets clicked after I finish the flick. What ends up happening when I'm using drags to slide divisions in and out of view is that if I flick quickly the incoming division receives a mousedown/click event right where I started my flick on the division that is sliding out.
http://scores.warbirdsiii.com/imote/index.html
I've got these three lines in the head to trap events
Code:
document.addEventListener("touchmove", function(e){return touchMove(e);}, false);
document.addEventListener("touchstart", function(e){return touchStart(e);}, false);
document.addEventListener("touchend", function(e){return touchEnd(e);}, false);