Long-Press Event Detection

Use touch events and timers to differentiate between a tap and a long-press gesture.

var timer;
var touchDuration = 500; // Duration required for a long-press

function onTouchStart(event) {
    timer = setTimeout(onLongPress, touchDuration, event); // Start the timer
}

function onTouchEnd(event) {
    clearTimeout(timer); // Clear the timer
}

function onTouchMove(event) {
    clearTimeout(timer); // If the finger moves, it's not a long-press
}

function onLongPress(event) {
    alert('Long-press detected!'); // Replace with your long-press handling logic
}

// Attach the event listeners to the target element
var targetElement = document.getElementById('your-target-element-id');
targetElement.addEventListener('touchstart', onTouchStart);
targetElement.addEventListener('touchend', onTouchEnd);
targetElement.addEventListener('touchmove', onTouchMove);

This code attaches touch event listeners to an HTML element with the id 'your-target-element-id'. The logic differentiates between a tap and a long-press by starting a timer on touchstart, which is cleared if the touch ends before the duration or if the finger moves. The onLongPress function is called if the touch duration exceeds the specified time.