Question

I’m trying to make a canvas based puzzle game for touch devices and I’m struggling with touch events. I want the touchFunction to fire twice, once for the touchstart event and once for the touchend event with the appropriate x and y co-ordinates.

Below is what I have, it works fine for touchstart but nothing for touchend, can anyone point me towards what the problem is please? Any help would be great, thanks.

    canvas.addEventListener('touchstart', touchFunction, false);
    canvas.addEventListener('touchend', touchFunction, false);


    function touchFunction(ev) {   
    console.log(ev.touches[0].pageX + " " + ev.touches[0].pageY);
    }

Answer 1

Have you looked at the touchmove event?

This will give you the x-y coordinate of where the current ‘press’ is. Very similar to mousemove.