Written by Sean Behan on Sun Apr 08th 2018

The double tap event isn't supported in libraries like jQuery Mobile (out of date anyway). But coding up your own function is very easy.

We will compare time in milliseconds between tap or click, events. The reason for both tap and click events is due to inconsistent behavior between progressive web apps on Android, iOS and desktop.

window.tapTime = (new Date).getTime()
$('body').on('touchstart click', '.selector', function(e){
     var delta = ((new Date).getTime() - window.tapTime)
        if( delta < 200 ){
                alert('Double Tap Detected')
        }
        window.tapTime = (new Date).getTime()
    })

You can play around with the delta, but I found 200 milliseconds to feel the most like traditional double tap event.


Tagged with..
#mobile #pwa #progressive web apps #javascript #touch

Just finishing up brewing up some fresh ground comments...