How to force stop touchmove in javascript?
<p>Here's what I created.</p>

<pre><code>var foo = document.getElementsByTagName('footer')[0],
    startX = 0,
    startY = 0,
    finalX = 0,
    finalY = 0;

function handleTouchStart(e){
    var touch = e.touches[0] || e.changedTouches[0];

    startX = touch.pageX;
    startY = touch.pageY;
}

function handleTouchMove(e){
    var touch = e.touches[0] || e.changedTouches[0],
        touchX = startX - touch.pageX;

    finalX += (touchX / 6);

    foo.style.marginLeft = finalX + 'px';

    if(Math.abs(touchX) &gt;= 50){
        e.preventDefault(); // not working
        // stop touchmove if possible (So, touchend will be triggered)
        // animate in touchend
    }
}

function handleTouchEnd(e){
    var touch = e.touches[0] || e.changedTouches[0],
        getTouch = startX - touch.pageX;

    if(getTouch &lt; 0){
        console.log('Swiping right: ' + getTouch);
    } else {
        console.log('Swiping left: ' + getTouch);
    }
}

foo.addEventListener('touchstart', handleTouchStart, false);
foo.addEventListener('touchend', handleTouchEnd, false);
foo.addEventListener('touchmove', handleTouchMove, false);
</code></pre>

<p>Basically, I just want to stop the touchmove so I can animate the element. I'd search my problem but unluckily, I don't get any solutions. </p>

<p>Note: I didn't use jQuery because I'm creating a performance-based applications.</p>

<p>Any advice/help would be appreciated. Thanks!</p>