С помощью JavaScript вы можете контролировать уровень масштабирования, хотя найденное мною решение не выглядит гладким.
Скажем, у вас есть в <head>
:
<meta id="vp" name="viewport" content="width=768,initial-scale=1.0">
Чтобы увеличить до 4x, и при этом позволить пользователю изменять масштаб, измените содержимое дважды:
var vp = document.getElementById('vp');
vp.content = "width=767,minimum-scale=4.0,maximum-scale=4.0,user-scalable=yes";
vp.content = "width=768,minimum-scale=0.25,maximum-scale=10.0,user-scalable=yes";
Переключение ширины очень важно - в противном случае Mobile Safari будет иметь серьезные ошибки перерисовки (из-за чрезмерной оптимизации).
Вы не можете просто установить initial-scale
снова - это игнорируется во второй раз.
scalesPageToFit = YES
это работает, но это меняет размер вашего контента по умолчанию, посмотрите на мой ответ, это будет полезно для вас.