Touch screen have a 300ms delay for the click event. This makes web apps feel slow. This can be avoided using touch events instead. See example below.
var getParentHash = function (el) {
if (!el) return null;
return (el.hash) ? el.hash : getParentHash(el.parentElement);
};
var getParentHref = function (el) {
if (!el) return null;
return (el.href) ? el.href : getParentHref(el.parentElement);
};
// avoid 300ms delay for touch screens
var tap = function(evt) {
// prevent click from happening
evt.preventDefault();
// an element inside an anchor might have been tapped
var hash = getParentHash(evt.target);
var href = getParentHref(evt.target);
// perform the desired action, i.e. show a screen etc.
history.pushState(null, null, hash);
show(href);
};
// register the touchstart event
var list = document.querySelectorAll('.menu-button');
Array.prototype.forEach.call(list, function(el) {
console.log(el);
el.addEventListener('touchstart', tap, false);
});