javascript non multi-touch events

Question

I am developing a small embedded application which uses a resistive touch screen (ADS 7846) that does not support multi-touch gestures.

The problem is that when using a finger (or other object) to touch the screen, the mousedown event only gets fired when the finger is released, if fact both the mousedown and mouseup events get fired only when the finger is removed.

function $(id) {return document.getElementById(id)};

$("butsetup").addEventListener("mousedown", function(e) {
  alert('down');
});

$("butsetup").addEventListener("mouseup", function(e) {
  alert('up');
});

Is there a solution to make this work as expected ?

As suggested by @antyrat this reports true:

alert( 'ontouchstart' in document.documentElement )

But I read somewhere that some browsers 'expose' this capability to the dom but do not enable it ?

Answer 1

Yes, you can use touchstart and touchend events:

$("butsetup").addEventListener( ('ontouchstart' in document.documentElement) ? "touchstart" : "mousedown", function(e) {
  alert('down');
});

$("butsetup").addEventListener( ('ontouchstart' in document.documentElement) ? "touchend" : "mouseout", function(e) {
  alert('up');
});

Answer 2

Use touchstart and touchend events .

$("butsetup").addEventListener("touchstart", function(event){  
    alert('touchstart');
}, true);

$("butsetup").addEventListener("touchend", function(event){  
    alert('touchend');
}, true);