DEV Community
Posted on Apr 11, 2021
Disabling Viewport Zoom on iOS 14 Web Browsers
I recently answered a question on Discord on how to disable double-tap to zoom on iOS browsers. I looked this problem up on Google, and most people said to use the viewport meta tag. Except that was four years ago and it seems that Safari no longer respects those tags.
Many are using Javascript to solve this, but that could be unreliable in many ways.
But now, since Safari 13, there is a way to disable viewport zooming.
What the touch-action property does is it disables all touch events going to the selected element(s) except for the value specified. So by setting the property to pan-y for the whole body, we're only letting the user pan up and down, no matter where they initiate the touch. Any other touch events, whether it be a double tap, a pinch, or even a pan left or right, will be ignored.
You can read more about the touch-action CSS property here
If you need to allow the user to pan both up or down and left or right, you can add pan-x :
If you have just pan-y turned on in your body selector, and you have smaller viewports inside your document where there will be horizontal scrolling, you can override the property value in the child element.
Fair Warning
In my testing I found out that on iOS, viewport zoom is fully disabled when the touch-action property is restricted like this. This applies even to automatic zooms that the browser performs, such as when the user taps on a text box with a font size smaller than 16px.
However, if even one element in the body has touch-action set to pinch-zoom or manipulation the browser will perform automatic zooms when tapping on small text boxes.
So be mindful of that, if you do have to enable manipulation or pinch-zoom events.
Top comments (4)
Templates let you quickly answer FAQs or store snippets for re-use.
- Joined Apr 3, 2019
Awesome! This worked for me. I had a Button element that I wanted to allow a user to tap in rapid succession. On iOS, it kept zooming in, meta-tags ignored. But, your tip fixed it!
- Education Politecnico di Milano
- Work Software Engineer Freelance
- Joined Sep 13, 2021
Hi, thanks for the article, as of ios 14.6 this method seems not to work while double-tap to zoom; pinch to zoom is blocked. Any ideas? Thanks
- Location Arkansas, USA
- Work Mobile Applications Developer at University of Arkansas for Medical Sciences
- Joined Mar 14, 2017
Hi, just trying to clarify what you're referring to here.
Do you mean it doesn't work when the double-tap to zoom and pinch to zoom events are cancelled via Javascript?
- Joined Sep 21, 2020
Thanks for the information. I was trying to find a way to handle that easily. Thanks
Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment's permalink .
Hide child comments as well
For further actions, you may consider blocking this person and/or reporting abuse
Why Magento is the #1 Choice of eCommerce Startups?
Hire Laravel Developers - Apr 19
Demystify google search
Akpevwe11 - Apr 14
Choosing Your Path: Specializations in Web Development
Hashir Afzal - Apr 14
10 Essential JavaScript Snippets Every Developer Should Know
David Omisakin - Apr 27
We're a place where coders share, stay up-to-date and grow their careers.
you can use css to remove the double-tap zoom feature on iOs
Apple Event: May 7th at 7 am PT
> Learn more
> Add to your calendar
Looks like no one’s replied in a while. To start the conversation again, simply ask a new question.
How to toggle off the double tap zoom on ipad Gen 9 .
When i am on a math game that need speed, i tap a double digit quickly , it doesn't capture my answer but instead zoom the screen. How do i off this function?
Posted on Jun 13, 2022 12:02 AM
Posted on Jun 13, 2022 12:46 AM
Check these options:
- Settings>Accessibility>Zoom... disable it
- Settings>Accessibility>Touch>Assistive Touch... disable it
- Settings>Accessibility>Touch>Touch Accommodations, and turn touch accommodations on. Then, go down to, “Ignore Repeat.” Turn it on, and adjust the duration to your liking (make some tests). If you make any sudden taps too quickly, it will not be registered (such as quick double taps).
- Settings>Display&Brightness>Zoom = standard
When done, restart your iPad(s).
Similar questions
- How do you disable the finger pinch zoom on iPad? Is there a way to disable the two finger pinch zoom on iPad? Simply disabling the zoom under accessibility on the iPad does not work. The iPads are used as Kiosks and people sometimes zoom in on accident. 2016 1
- Can’t turn zoom off with finger taps on iPhone Can’t turn zoom off with finger taps on iphone [Re-Titled by Moderator] 91 2
- iPhone improvement Is there a way to be able to zoom with two fingers on any and everything? Can the phone override an app so I can zoom anytime I want? 225 1
Loading page content
Page content loaded
Jun 13, 2022 12:46 AM in response to Lynjia
iOS 13: Double Tap to Zoom in Safari No Longer Works
Double Tap Zoom
Instead of double tapping you’ll have to pinch and un-pinch to zoom in and out. While it’s not a huge change, it was a feature that made using your iPhone with one hand easier. So far it appears to be only removed in Safari. Double tap to zoom works in Maps and Photos.
If you’ve noticed other small features that have been removed, share them in the comments below and we’ll write about it.
Further Reading:
[ Instagram Gets Dark Mode in iOS 13 ]
[ Apple Has to Pay Taxes in Every Country it Operates in ]
Leave a Reply Cancel reply
You must be logged in to post a comment.
This site uses Akismet to reduce spam. Learn how your comment data is processed .
- Forums New posts Trending Search forums
- What's new New posts Latest activity
- Members Current visitors Billboard Trophies
iPhone 16: All the rumors so far!
Turn off the double tap zoom
- Thread starter Albert_27
- Start date Jul 29, 2016
- Cell Phones
- Android Smartphones
Commendable
- Jul 29, 2016
how do i turn off the double tap zoom
webworkings
- Jul 30, 2016
How to turn off the double tap zoom (Magnification Gestures) The double tap zoom, or Magnification Gestures as it is actually called, enables you to temporarily magnify what’s on your phones screen. To enable, or disable, magnification gestures you need to... 1. Go to "Settings" and then "Accessibility". 2. Next tap "Magnification Gestures". 3. Set it to either on or off, depending on which you are trying to do. Note: When "Magnification Gestures" are turned on, you can magnify, pan, and zoom in many ways. 1. You can zoom in or out by "triple-tapping" the screen. Then, while zoomed in, you can: a. "Drag" two or more fingers to pan across the screen. b. "Pinch" two or more fingers together, or spread them apart, to...
How to turn off the double tap zoom (Magnification Gestures) The double tap zoom, or Magnification Gestures as it is actually called, enables you to temporarily magnify what’s on your phones screen. To enable, or disable, magnification gestures you need to... 1. Go to "Settings" and then "Accessibility". 2. Next tap "Magnification Gestures". 3. Set it to either on or off, depending on which you are trying to do. Note: When "Magnification Gestures" are turned on, you can magnify, pan, and zoom in many ways. 1. You can zoom in or out by "triple-tapping" the screen. Then, while zoomed in, you can: a. "Drag" two or more fingers to pan across the screen. b. "Pinch" two or more fingers together, or spread them apart, to adjust the zoom level. Another Note: If you enter, or exit, an app when zoomed in, you should be automatically zoomed out. To re-zoom in, all you need to do is triple-tap the screen again. To temporarily magnify what's under your finger, triple-tapthe screen and then hold it on the last tap. In this magnified state, you can: 1. "Drag" your finger to explore different parts of the screen. 2. "Lift" your finger to return to the previous state. Note: Triple-tap for magnification works everywhere except the keyboard and navigation bar.
Similar threads
- Nov 7, 2023
- Article Commentary
- Oct 4, 2023
- Oct 25, 2023
- Nov 8, 2023
- Sep 13, 2023
TRENDING THREADS
- Started by Spence808
- Wednesday at 12:48 PM
- Replies: 16
- Started by samsungwifiroblems
- Wednesday at 1:04 PM
- Started by kilvi00
- Wednesday at 4:20 PM
- Started by a1star
- Yesterday at 8:45 AM
- Started by Sharmick
- Wednesday at 4:05 PM
- Started by kep55
- Sunday at 7:07 PM
- Started by Akashaya
- Wednesday at 6:32 AM
Share this page
- Advertising
- Cookies Policies
- Term & Conditions
IMAGES
VIDEO
COMMENTS
If you are doing this with a 3 finger double tap, that's not specific to Safari.. that is activating an accessibility feature called Zoom and you can do that in any app on your iPhone, also from your Home Screen. If that's what you're seeing, you'd disabled that by going into Settings > Accessibility > Zoom and turning off the switch at the top.
I want to disable the double-tap zoom functionality on specified elements in the browser (on touch devices), without disabling all the zoom functionality. ... Disable double tap zoom on mobile (2023 IOS Safari solution): I found that using the meta tag method was not a viable solution for mobile safari browsers. Here is the solution that worked ...
I recently answered a question on Discord on how to disable double-tap to zoom on iOS browsers. I looked this problem up on Google, and most people said to use the viewport meta tag. Except that was four years ago and it seems that Safari no longer respects those tags. Many are using Javascript to solve this, but that could be unreliable in ...
We can understand the inconvenience of activation of this feature without intending to and we'd like to help. Find the steps to disable it in Zoom in on the iPad screen. Let us know if that doesn't completely square you away and we'll be happy to continue. Regards. How to turn off iPad double tap zoom. .
When you want to disable "double tap to zoom" only on part of your screen (in my case, there was an image gallery that allows going to the next or previous image by tapping on the right or left side of the gallery and double tapping was interrupting the user experience), you can set pointer-events: none on the image elements or their parents, and attach event listeners to the root element of ...
It's very annoying. Anyway, here's a simple css solution that stops the double-tap zoom. button {. touch-action: manipulation; } touch-action is a css property that defines how an element can be used by a touch screen. Of course, you shouldn't stop everything being zoomable, just specific elements that are causing trouble.
This will partially disable all double tapping features, but you will be able to adjust the duration. Steps: Go to the settings app, accessibility, touch, touch accommodations, and turn touch accommodations on. Then, go down to, "Ignore Repeat.". Turn it on, and adjust the duration to your liking. If you make any sudden taps too quickly, it ...
Posted on Jun 13, 2022 12:46 AM. Check these options: Settings>Accessibility>Zoom... disable it. Settings>Accessibility>Touch>Assistive Touch... disable it. Settings>Accessibility>Touch>Touch Accommodations, and turn touch accommodations on. Then, go down to, "Ignore Repeat.". Turn it on, and adjust the duration to your liking (make some ...
Learn how you can enable or disable Double tap to zoom on the iPhone 14 / iPhone 14 Pro/14 Pro Max/ iPhone 14 Plus running iOS 16.If you like to quickly zoom...
Well, one thing you could try is Settings / General / Accommodations / Ignore repeat (turn on) and set a relatively longer time. Maybe that would help? Doesn't work. I can already zoom by pinch-zooming. The double-tap to zoom is so annoying when you're pressing buttons on a website quickly.
Double Tap Zoom. Instead of double tapping you'll have to pinch and un-pinch to zoom in and out. While it's not a huge change, it was a feature that made using your iPhone with one hand easier ...
CSS to disable double-tap zoom globally: * { touch-action: manipulation; } Edit: I tested it with this on a IPhone 7 Plus with IOS v14.4.2 and it works for me. ... Disable double tap zoom on Safari iOS 13 + 7. How to handle Safari iOS zoom on input fields. Hot Network Questions
And when they want to zoom in, they can use pinch to zoom. A loooot of websites have this feature disabled - apple, google and so on. But double tap is not the default way to select text, long press is. I believe you can set double-tap action to prevent default with JavaScript.
Go to "Settings" and then "Accessibility". 2. Next tap "Magnification Gestures". 3. Set it to either on or off, depending on which you are trying to do. Note: When "Magnification Gestures" are turned on, you can magnify, pan, and zoom in many ways. 1. You can zoom in or out by "triple-tapping" the screen.
17. Adding an empty click listener on HTML elements will prevent double tap zoom. It's ugly but does the job. myElement.addEventListener("click", event => {}); Next thing i'm trying to figure out to disable all zooming is preventing pinch. Unfortunately, touch events are not dispatched during iOs momentum scrolling.
It appears that as of IOS 10, apple removed user-scalable=no for accessibility reasons, so that's why it only works in 3rd party browsers like Firefox. The closest I found to disabling double tap zoom was this. var lastTouchEnd = 0; document.addEventListener('touchend', function (event) {. var now = (new Date()).getTime();
Hello, looks like your post is about Support. Please remember we only allow Software Issues here at r/iOS.Hardware issues should be posted to r/applehelp or r/iphonehelp.. Please also check out the Tech Support FAQ If your issue is found there, please delete your post.. If a user replies to you with an answer that works, please reply/comment -solved. This will change the flair of your post and ...