I have just added the following HTML to the <head>
section of my iPhone web app:
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;"/>
This (supposedly) limits the zoom of the page so the user can't zoom in. On iOS versions prior to 4.0, this tag is respected - but iOS versions 4.0+ completely ignore it, and lets you zoom in all you want. Furthermore, if you rotate, iPhone 4 will weirdly zoom in automatically.
So what I'm asking is, How can I "lock" the zoom for my app? Can anyone point me in the right direction?
If you have Zoom enabled in the Accessibility settings (inside General), Safari seems to ignore the viewport meta (tested only on iPhone 4 on iOs 4).
You need to reload your page after changing the setting.
typo? use comma.
try this:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
Also, why use maximum-scale if you want the viewport to be fixed? If you use "width=device-width", the viewport will be different between iphone3 and iphone4.
You may try this one too:
<meta name="viewport" content="width = (your page width), user-scalable = no"/>
please replace (your page width) with your site's width.
来源:https://stackoverflow.com/questions/3272511/iphone-4-ignoring-viewport-meta-tag