Cordova - 'touchmove' Event doesn't fire right away

Question

I have this simple code:

document.addEventListener('touchmove', onDocumentTouchMove, false);

function onDocumentTouchMove(event)
{
    for(var i = 0; i < event.touches.length; i++)
    {
        clickX[i] = event.touches[i].pageX;
        clickY[i] = event.touches[i].pageY;
    }
}

What I'm trying to do is make the event 'touchmove' to fire right away, but it requires a specific amount of pixels to pass, like a threshold before it fires.

In my case, it seems like I must move my finger about half an inch before it fires. Is there a way of making it fire without having a threshold?

I'm trying to drag a simple box in my app, but it seems like it is checking for different events before it recognizes the 'touchmove' and makes it look ugly because of the delay.

This is a distance issue, not a time one.

score 2 · Accepted Answer · answered Feb 25 '16 at 07:37

I was able to solve this by adding:

event.preventDefault();

inside my functions:

onDocumentTouchStart (prevents delay in firing other events)

onDocumentTouchMove (prevents scrolling)

document.addEventListener('touchstart', onDocumentTouchMove, false);
document.addEventListener('touchmove', onDocumentTouchMove, false);

function onDocumentTouchStart(event)
{
    event.preventDefault(); //Allows firing of other events asap
    for(var i = 0; i < event.touches.length; i++)
    {
        clickX[i] = event.touches[i].pageX;
        clickY[i] = event.touches[i].pageY;
    }
}
function onDocumentTouchMove(event)
{
    event.preventDefault(); //Prevents Scrolling
    for(var i = 0; i < event.touches.length; i++)
    {
        clickX[i] = event.touches[i].pageX;
        clickY[i] = event.touches[i].pageY;
    }
}

Had this problem for months! Now it works beautifully in all my apps! :D

Also, here's a nice read on touch events:

https://www.w3.org/TR/touch-events/#dfn-touchmove

Cordova - 'touchmove' Event doesn't fire right away

1 Answers1