· 1 min read

How to Emulate Double Tap for Progressive Web Apps (PWA) iOS and Android

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.

Comments

Leave a comment