Touch events

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

      // 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);

    // register the touchstart event
    var list = document.querySelectorAll('.menu-button');
    Array.prototype.forEach.call(list, function(el) {
      el.addEventListener('touchstart', tap, false);


All mobile browsers suport touch events. Chrome and Firefiox also support it on desktops.

Recommended reading