Today’s topic is -
How to disable pinch to zoom feature on iPhone
I’ve seen developers often asking this question “How to disable pinch to zoom feature on iPhone?” Use’s or Developers who have used Smartphones/Touch sensitive phones like iPhone, Samsung and Windows Phones might have noticed and might have also experienced one of it’s feature [Pinch to zoom]. It nothing but – to zoom anything on these device, you have to just pinch the device screen in and out to Zoom-in and Zoom-out.
Some may want that feature and some may not want. Especially, web developers who develop web applications for iPhone might not want users to zoom beyond the normal zoom level which are set for particular devices.
For example – You have responsive website for one of the smart phone. You have a banner on top of the website. Since the banner is already optimized of web it will not have the full quality. Further – if the user starts to pinch and zoom it – the image will start to pixelate. Not only that – If the user starts zooming into the Web application – it tends to break the layout as well. So these are the reasons the reason for which developer might want to disable the disable pinch to zoom feature on iPhone.
Disabling the feature doesn’t mean that – it is completely taken out from the device. It is just disabled out from your particular web application.
Here is how you do it:
If you do not want your user’s scale it furthermore, i.e. if you do not want them to zoom into the page too much – then, you will have to limit them by using an additional attribute “user-scalable=no”.
This is used with a <meta> tag as seen below:
As mentioned earlier – the important thing in the above line of code is “user-scalable=no” – Which will stop users from zooming in to your Website or app.
You can apply this piece of code within your HTML document’s <head> </head> section as seen below.
<title> Document title </title>
<meta name=”viewport” content=”width=device-width,initial-scale=1.0,user-scalable=no” />
So guys, that’s how you limit your users from zooming into your Web applications causing them to break. For a detailed article on that – Please visit this article Simple-responsive-website-for-iphone
Hope this tutorial “How to disable pinch to zoom feature on iPhone” was worth going through. Any questions regarding this? Please feel free to comment below in the comment section. I’ll be pleased to answer you!