When I try to inspect the touchmove
event in this jsbin demo it only triggers once in Chrome and Opera for Android, and immediately after that, it triggers a touchcancel
event, instead of continuing to trigger touchmove
events?
Based on both the W3C specs, and the behaviour of the touchmove
event in both Firefox for Android and Android's default browser, it seems to me that the way the touch events are supposed to work is that the touchmove
event keeps triggering while the touch is still on the page. After trying to test in this jsbin though, I got the following log messages:
touchstart event; starting on (140,197) on the screen, or (381,536) on the page.
touchend event; starting on (undefined,undefined) on the screen, or (undefined,undefined) on the page.
touchstart event; starting on (181,137) on the screen, or (492,372) on the page.
touchmove event; starting on (182,153) on the screen, or (495,416) on the page.
touchcancel event; starting on (undefined,undefined) on the screen, or (undefined,undefined) on the page.
This is what happened when I first tapped the screen (shown via a touchstart
and touchend
), and then dragged the screen (touchstart
, touchmove
and touchcancel
). Going by the same specs mentioned above, the touchcancel event should only run when something interferes , such as the browser interface (if I understand that correctly).
Since I was simply sliding my finger over the body, without leaving the window at all, I am really puzzled by this, so would anybody know why this is happening?
I am getting this unexpected result in Chrome 32 and Opera 19 for Android.
Turns out the problem here was simply the fact the event handler didn't have an event.preventDefault()
in it, so the original action still executed, which apparently interrupted the touch event. To fix this, simply add e.preventDefault()
in the current event handler function to cancel the current event, and make it work as expected in Chrome and Opera too.
Working demo.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With