Created
March 15, 2012 22:59
-
-
Save johan/2047491 to your computer and use it in GitHub Desktop.
A jQuery plugin to selectively disable the iOS double-tap-to-zoom action on specific page elements (and have that generate two click events instead).
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// jQuery no-double-tap-zoom plugin | |
// Triple-licensed: Public Domain, MIT and WTFPL license - share and enjoy! | |
(function($) { | |
var IS_IOS = /iphone|ipad/i.test(navigator.userAgent); | |
$.fn.nodoubletapzoom = function() { | |
if (IS_IOS) | |
$(this).bind('touchstart', function preventZoom(e) { | |
var t2 = e.timeStamp | |
, t1 = $(this).data('lastTouch') || t2 | |
, dt = t2 - t1 | |
, fingers = e.originalEvent.touches.length; | |
$(this).data('lastTouch', t2); | |
if (!dt || dt > 500 || fingers > 1) return; // not double-tap | |
e.preventDefault(); // double tap - prevent the zoom | |
// also synthesize click events we just swallowed up | |
$(this).trigger('click').trigger('click'); | |
}); | |
}; | |
})(jQuery); |
none of the previous coding seems to work///
here are magical lines that remove double-tap-to-zoom
document.addEventListener('dblclick', function(event) {
event.preventDefault();
}, { passive: false });
it removes default behavior at double click
@evelinamikhailova87 You made my day, nothing else worked, the 'dblclick' one does magic! No more double tap zoom on iOS 15 (iPadOS 15) for me! Thank you!!
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Most modern browsers (circa 2020+) treat tap events (and wheel, and scroll, etc) as passive, which, long story short, means they're not expected to call
preventDefault()
, hence this extension will at best throw console errors or in most cases, simply not work.The solution is to pass
false
foraddEventsListeners
passive property, the problem is jQuery doesn't support this viabind()
.Thus, for modern uses it may be best to stick with pure JS: