Как заставить точный масштаб на Ipad - PullRequest
4 голосов
/ 16 июня 2011

То, чего я пытаюсь добиться, это: заставить масштабировать 1,0 , когда ipad находится в альбомном режиме, и 0,75 , когда он в портретном режиме, но с отключено пользовательское масштабирование..Я перепробовал все комбинации мета-тэгов, и ничего не получалось:

  • , когда масштабируемый пользователем равен нет , ландшафт работает нормально, но это не такмасштабировать до 0,75 в портретной ориентации, независимо от того, как я установил максимум и минимум масштаб
  • , когда масштабируемый пользователем равен да , иногда он работает нормально, но, поскольку есть много добавления контента с помощью ajax, иногда, когда страница становится длиннее, страница просто уменьшается, чтобы уместить всю страницу на экране, и я хочу предотвратить это
* 1026Итак, есть ли способ заставить масштабирование до точного числа?Или отключить масштабирование при изменении длины страницы?(Ширина страницы всегда должна составлять 1024 пикселя, никакой разной CSS для различной ориентации и никакой ширины = ширина устройства, мне просто нужно масштабировать)

Ответы [ 4 ]

6 голосов
/ 02 февраля 2012

Ответ Патрика определенно полезен, вот более проверенная версия

var checkOrientation;
checkOrientation = function() {
  var viewport;
  viewport = document.querySelector("meta[name=viewport]");
  if (window.orientation === 90 || window.orientation === -90) {
    return viewport.setAttribute("content", "width:device-width, initial-scale=1.0, user-scalable=1");
  } else {
    return viewport.setAttribute("content", "width:device-width, initial-scale=0.6, user-scalable=1");
  }
};
window.onorientationchange = function() {
  return checkOrientation();
};
checkOrientation();

И не забудьте добавить это в заголовок документа:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

Обратите внимание, что одинразницы, это запятые вместо точек с запятой в аргументах

4 голосов
/ 07 июля 2011

Нет способа достичь этого исключительно с настройкой метапортпорта.

Однако можно определить ориентацию с помощью javascript и изменить настройку метапортпорта с помощью javascript, чтобы можно было запускать скрипт при изменении ориентации и задавать другой видовой экран.

Возможно что-то вроде этого (не проверено):

window.onorientationchange = function() {
  viewport = document.querySelector("meta[name=viewport]");
  if (window.orientation == 90 || window.orientation == -90) {
    viewport.setAttribute('content', 'width=device-width; initial-scale=1.0; user-scalable=1');            
  } else {
    viewport.setAttribute('content', 'width=device-width; initial-scale=0.75; user-scalable=0');            
  } 
}
1 голос
/ 16 июня 2014

Не забудьте также включить в javascript максимальный масштаб = 1 и использовать правильный "width = device-width":

var checkOrientation;
checkOrientation = function() {
  var viewport;
  viewport = document.querySelector("meta[name=viewport]");
  if (window.orientation === 90 || window.orientation === -90) {
    return viewport.setAttribute("content", "width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=1");
  } else {
    return viewport.setAttribute("content", "width=device-width, initial-scale=0.6, maximum-scale=1, user-scalable=1");
  }
};
window.onorientationchange = function() {
  return checkOrientation();
};
checkOrientation();
0 голосов
/ 08 июля 2012

Или используйте язык сервера, чтобы обнаружить присутствие iPad через USER_AGENT.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...