Авто-увеличение при изменении ориентации в iOS 7

Question

Авто-увеличение при изменении ориентации в iOS 7

0

У меня была веб-страница, которая отлично работала, пока Apple не вышла с iOS 7 сегодня, и она сломала макет, когда изменилась ориентация экрана.

В основном, когда я фокусируюсь на текстовой области и поворачиваю экран в альбомный вид, вся страница масштабируется. Если фокус вынимается из текстовой области и возвращается в портрет, все возвращается в нормальное состояние.

Вращение также хорошо работает, когда текстовые области не имеют фокуса.

У меня уже есть метатег на месте (чтобы мы блокировали масштабирование):

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0;;">

Любые идеи, которые вызывают это неудобное поведение?

Saket 19 сен. 2013, в 15:52

Источник

Теги:

html

css

iphone

mobile

ios7

1 ответ

Ещё вопросы

reyaner · Answer 1 · 2013-09-25T11-22-00.000Z

Что вы подразумеваете под сломанным макетом? Я бы хотел увидеть скриншот!

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

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

Но im предотвращает стандартное увеличение при фокусировке элементов формы с помощью jQuery или JS, если jQuery не используется!

$("input[type=text], textarea, select").focus(function(){
        $('head meta[name=viewport]').remove();
        $('head').prepend('<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0;" />');
     }).blur(function(){
        $('head meta[name=viewport]').remove();
        $('head').prepend('<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=1;" />');
});

Как я уже упоминал, он в основном просто увеличивает масштаб страницы примерно до 300% от исходного размера, что приводит к тому, что пользователям приходится прокручивать страницу.