2011-01-11 2 views
3

Я создаю специальное веб-приложение для iPad. В настоящее время я пытаюсь установить ширину страницы & параметров видового экрана для оптимизации сайта.Настройки экрана iOS

Я пытаюсь добиться того, чтобы веб-приложение отображалось в полноэкранном режиме как в ландшафтном, так и в портретном режимах без масштабирования пользователя и без пустых областей слева и справа от содержимого.

я могу добиться этого с:

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

и

max-width:1024px; 
min-width:768px; 

Проблема тогда, является кодирование всех моих CSS для переменной ширины. Я бы предпочел иметь одну ширину css, чтобы я мог правильно кодировать ширину элементов страницы.

Итак, если я установил css, чтобы иметь одну ширину, я не могу получить настройки видового экрана правильно! Когда я открываю страницу в портрете с этими настройками:

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

все работает нормально. Когда я поворачиваю устройство на пейзаж, снова все хорошо. Возвращаясь к портрету, тогда у меня проблемы. Страница слишком велика для окна просмотра! Я хочу, чтобы он по-прежнему соответствовал ширине устройства!

Кажется, что это должно быть очень просто! Я что-то упускаю? На самом деле у меня нет iPad (хватит на v2), поэтому im тестирование на симуляторе iOS, которое поставляется с xcode - там не должно быть любой разницей, хотя!

Я пользуюсь this.

ответ

1

Не уверен, что это помогает, но есть способ обнаружить вращение и выполнить действия. Возможно, заставит страницу снова отобразить или проверить масштабирование. Однако до сих пор я не сталкивался с этой проблемой на iPad, есть ли у вас страница, которую мы можем проверить для тестирования на устройстве?

<body onorientationchange = "updateView();"> 

<script> 
    function updateView() 
    { 
     switch (window.orientation) 
     { 
      case 0: // Portrait 
       break; 
      case 90: ; // Landscape 
       break; 
      case -90: ; // Landscape counterclockwise 
       break; 
     } 
    } 
</script> 
+0

Как я уже говорил, «вверх», «вверх ногами» (домашняя кнопка вверх) устройство iOS в отчетах о портретной ориентации «180», возможно, вы захотите добавить этот случай. –

Смежные вопросы