У меня есть простая страница с
<meta name="viewport" id="extViewportMeta" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
на нем, со всем размером, красивым для отображения на iPhone.
Но когда я помещаю iframe на эту страницу, все внутри iFrame не масштабируется и масштабируется до размера родительской страницы.
Как разрешить масштабирование только внутри iframe, не путаясь с остальной частью моей страницы?
То, что вы запрашиваете, к сожалению, невозможно.
Во-первых, в метатеге "viewport" ваш атрибут "content" указывает, что пользователь вашего сайта НЕ МОЖЕТ масштабироваться. Это то, что диктуется 'user-scalable = no'.
Кроме того, максимальная и минимальная шкала установлены на 1, поэтому даже если вы удалите "user-scalable = no", масштабирование будет отключено из-за того, что вы нет диапазона масштабирования для пользователя, чтобы увеличить его.
Итак, чтобы включить масштабирование для пользователя, вам придется удалить масштабируемое пользователем = нет и установить разные значения шкалы min и max.
См. эту ссылку, чтобы лучше понять настройки метатега "viewport":
Во-вторых, поскольку метатег "viewport" установлен на вашей "родительской" странице, эти настройки применимы к чему-либо внутри этой страницы, то есть к iframe. Является ли iframe другим мета-тегом "viewport", указывающим разные настройки, не имеет значения, так как он живет внутри и подчиняется настройкам его родителя.
Это возможно через jQuery. Привяжите масштабирование и панорамирование событий, чтобы ничего не делать при масштабировании и панорамировании вне div, которые вы можете масштабировать и панорамировать. Затем для разделов, которые вы хотите разрешить масштабирование и панорамирование, вы можете использовать плагины, такие как Panzoom, которые используют "преобразования CSS3 и функции матрицы", чтобы разрешить для масштабирования и панорамирования.
Это невозможно, так как iOS не позволяет масштабировать - вы можете просто прокручивать свой iFrame.
Это внешний сайт, который у вас есть? Если это так, измените код CSS и добавьте его в окно просмотра, как в вашем вопросе сверху.
Кроме того, вы можете загружать данные с помощью PHP. Вы наверняка найдете решение своей проблемы - если нет, не стесняйтесь задавать последующие вопросы.