Skip to content

Instantly share code, notes, and snippets.

@rafbm
Created July 9, 2012 15:01
Show Gist options
  • Save rafbm/3077036 to your computer and use it in GitHub Desktop.
Save rafbm/3077036 to your computer and use it in GitHub Desktop.
This is how I handle snappy taps on iOS.

This is how I handle snappy taps on iOS.

I create a little jQuery/Zepto “plugin” function:

$.fn.onClickOrTouch = (callback) ->
  if window.ontouchend != undefined # insanely clever touch detection
    this.each -> this._touchMoveCount = 0

    this.on 'touchmove', ->
      this._touchMoveCount++

    this.on 'touchend', (e) ->
      if this._touchMoveCount < 3
        callback.call this, e

      this._touchMoveCount = 0

    this.on 'click', -> false
  else
    this.on 'click', callback

Then, instead of using jQuery/Zepto’s click event…

$('a#my-link').on 'click', ->
  # ...

…I register events with onClickOrTouch:

$('a#my-link').onClickOrTouch ->
  # ...

With onClickOrTouch, events fire on touchend, but only if the user triggered less than 3 touchmove’s since touchstart on the link. It’s a good threshold to avoid unintentional taps, specially when you want to scroll rather than tap.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment