Arhn - архитектура программирования

Как заставить браузер Android не изменять ширину области просмотра при увеличении/уменьшении масштаба?

Я хотел бы знать, как заставить браузер Android (предпочтительно с использованием чистого CSS3) не изменять ширину области просмотра, когда пользователь увеличивает/уменьшает масштаб пальцами?

У меня есть несколько медиа-запросов на странице, направленных на разную ширину области просмотра. Но каждый раз, когда пользователь увеличивает/уменьшает масштаб, ширина области просмотра страницы изменяется, поэтому макет страницы переупорядочивается, и я этого не делаю. Я хочу, чтобы браузер Android «запоминал» свой первоначальный размер области просмотра, и когда пользователь увеличивает/уменьшает масштаб, я хочу, чтобы браузер Android ПРОСТО увеличивал масштаб, но не менял размер области просмотра.

Возможно ли это с помощью CSS? Спасибо за любую помощь заранее.

РЕДАКТИРОВАТЬ: Мои медиа-запросы:

@media only screen and (min-width : 800px) and (max-width : 999px) {
  #content { width:800px; }
}
@media only screen and (max-width : 799px) {
  #content { width:600px; }
}
android html css viewport android-browser
08.01.2012

  • Можете ли вы показать ваши медиа-запросы, пожалуйста? 14.01.2012
  • @ Майкл Конечно, нет проблем. У меня есть эти два медиа-запроса для поддержки трех типов устройств. Настольные компьютеры (ширина › 1000 пикселей), планшеты и смартфоны с высоким разрешением (ширина 800-1000 пикселей) и все остальные телефоны и устройства (ширина ‹ 800 пикселей). Проблема (как описано в моем вопросе) заключается в том, что когда я увеличиваю/уменьшаю страницу на мобильном устройстве, она продолжает менять область просмотра, а макет также продолжает меняться, потому что макет страницы отличается для каждого типа устройства. Но это совсем не желательно. Я хочу один макет исправления для каждого типа устройства, но с возможностью масштабирования. 14.01.2012

Ответы:


1

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

Например, если вы хотите установить ширину области просмотра равной 600 пикселей, вы должны включить эту строку в свой HTML <head>:

<meta name="viewport" content="width=600px">

Затем вы можете установить ширину других элементов на странице, зная, насколько она будет шире пропорционально области просмотра. Например, этот элемент займет всю ширину мобильного браузера:

#content {
   width: 600px;
}

Вместо масштабирования содержимого в соответствии с областью просмотра вы можете масштабировать область просмотра в соответствии с содержимым.

21.01.2012

2

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

20.01.2012
  • К сожалению, я не могу изменить раскладку. Но не могли бы вы уточнить, какой подход вы бы порекомендовали? 20.01.2012
  • Измените размер окна браузера после загрузки этого сайта. 20.01.2012
    • Новые материалы
    Коллекции публикаций по глубокому обучению
    Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..
    Представляем: Pepita
    Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..
    Советы по коду Laravel #2
    1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..
    Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
    Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..
    3 способа решить квадратное уравнение (3-й мой любимый) -
    1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..
    Создание VR-миров с A-Frame
    Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..
    Демистификация рекурсии
    КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..