html5/android touchcancel

Question

I try to work on an interface on html5 for mobile. i try to follow a mouvement, with touchstart/touchmove/touchend/touchcancel. but when i try to follow a mouvement i allways quikly have au 'touchcancel' and no more touchmove then...

when i try this : http://miniapps.co.uk/code/touchcancel/ it work perfectly, i do not have any problem.

But i think the problem come from the mouvement of the web browser that interfering with my canvas. Do you know can i fix this ?

// I try to explain more : - Here is my test code : http://frys.free.fr/mNaissance/test.html it's the "Jigsaw" puzzle code that i try to make working with a mobile. I had a "log" div hunder the text. And when i do "touchmove" on the grey canvas i have very fast a 'touchcancel' and no anymore 'touchmove' Is it more clear ? sorry for my poor english !

Thanks for help

Conventual

I have no idea what you're talking about. Please be more precise. And possible add code that is not working, or more examples explaining what you've tried – Calices

I just ran into something I believe is the same problem: the question is "Android browser sometimes fires a touchcancel event for no obvious reason, why?" // same code runs nice on iOS devices – Waterproof

Your links didn't work, but this SO question may have some clues: stackoverflow.com/questions/15944197 – Ogg

Answer 1

I believe I found out the reason for this - Android browser (as well as Chrome for Android 4.0+) believes you are trying to scroll, so it fires the touchcancel event. What you should do is

event.preventDefault();

on touchmove event you are capturing.

Waterproof

My case was related, but using this didn't help. For those who may have a problem vaguely related to that of the OP, see this SO question: stackoverflow.com/questions/15944197 – Ogg

This solution now also applies to the desktop version of Chrome for the same reasons. – Afoot

This is not related to Android browser only, this is by design because the browser must take over actions such as pan and zoom automatically in all cases.For that reason the browser fires the touchcancel event when it's taking over the touchmove event, to prevent executing 2 different actions for the same event (this would have terrible results) – Orontes