Js event on button for mobile web

Question

I'm developing a mobile web envoirment where i have a simple image used like this:

<img src='img/up.png' onmousedown="hourUse('hours',1);">

The js function simply adds .5 to a number:

function hourUse(cId,cMode) {
var current = parseFloat($('#'+cId).val());
var newRes = current+0.5;
$('#'+cId).val(newRes);
}

This works fine. However, it seems that when testing it on mobile there is a small delay. That means that the button cannot be tapped "fast" to increase the number. The user has to click the button at a "slow pace" in order to increase the number.

Not quite sure what to do about that (if anything can be done)

Thank you

Answer 1

As you say:

This works fine. However, it seems that when testing it on mobile there is a small delay. (is TRUE)

The reason is that by default, the browser's waits about 300 ms for a possible doubleClick/doubleTap event, before calling the function (hourUse('hours',1); in this case).

There are some solutions available, check a library called FastClick (Polyfill to remove click delays on browsers with touch UIs).

here is the link: https://github.com/ftlabs/fastclick