Disable zoom on mobile network

Question

I want to disable Pinch and Zoom on mobile devices.

What configuration should I add to the viewport?

Link: http://play.mink7.com/n/dawn/

Answer 1

EDIT:. As this continues to comment, we all know that we should not do this. The question was how I do it, but should not. I'm doing it.

Add this to your mobile devices. Then make your width as a percentage, and everything will be fine:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 

Add this for devices that also cannot use the viewport:

 <meta name="HandheldFriendly" content="true" /> 

Answer 2

It's all I need:

 <meta name="viewport" content="user-scalable=no"/> 

Answer 3

For everyone who said that this is a bad idea, I want to say that this is not always a bad idea. Sometimes it’s very boring to zoom out to see all the content. For example, when you enter input on iOS, it scales to get it in the center of the screen. You must zoom out after the reason the keyboard is closed does not work. I also agree that when you invest many hours in a great layout and user interface, you don’t want it to be confused by scaling.

But another argument is also valuable for people with vision problems. However, in my opinion, if you have problems with your eyes, you are already using the system's scaling functions, so there is no need to disturb the content.

Answer 4

IE has its own path: css property, -ms-content-scaling. Do not install it on the body or something should disable it.

Disable pinch to zoom in IE10

http://msdn.microsoft.com/en-us/library/ie/hh771891(v=vs.85).aspx

Answer 5

Try using the min-width property. Let me explain to you. Suppose the device has a screen width of 400 pixels (for example). As you zoom in, the fonts get bigger and bigger. But boxes and divs remain the same width. If you use the minimum width, you can avoid reducing the div and field.

Answer 6

Unfortunately, the proposed solution does not work in Safari 10+, since Apple decided to ignore user-scalable=no . This topic has more detailed information and some JS hacks: disable iOS 10+ safari viewport zoom?