Проблема медиазапросов в jQuery Mobile

Question

Мы работаем над приложением, используя jQuery Mobile Framework. Пока что приложение работает очень хорошо, и теперь мы думаем об использовании условных CSS-сценариев «медиа-запросов» для разных размеров окна браузера.

Наша идея заключается в том, что когда кто-то получает доступ к нашему приложению из мобильного браузера, такого как iPhone / Android / Windows phone, - он может просматривать всю ширину и высоту. Но когда кто-то получает доступ из обычного настольного браузера и его ширина превышает 800 пикселей, нам нужно изменить размеры нашего приложения как по ширине, так и по высоте.

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

Кто-нибудь может мне подсказать, как изменить высоту окна JQM?

Ожидание заключения эксперта.

Answer 1

Я думаю, что точка обзора будет обрабатывать ширину, а содержимое должно обрабатывать высоту страницы.Я думаю, что для высоты также есть значение по умолчанию.

метатег Viewport Обратите внимание, что в заголовке есть мета-тег viewport, указывающий, как браузер должен отображать уровень масштабирования страницы и размеры.Если это не установлено, многие мобильные браузеры будут использовать «виртуальную» ширину страницы около 900 пикселей, чтобы она хорошо работала с существующими сайтами для настольных компьютеров, но экраны могут выглядеть уменьшенными и слишком широкими.Если для атрибутов области просмотра установить значение content="width=device-width, initial-scale=1", ширина будет установлена ​​равной ширине в пикселях экрана устройства.

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

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

• http://jquerymobile.com/test/docs/pages/page-anatomy.html

Также естьявляется глобальным параметром конфигурации класса A, но не уверен, поможет ли это:

• http://jquerymobile.com/test/docs/api/globalconfig.html
• http://jquerymobile.com/test/docs/about/platforms.html

gradeA функция, которая возвращает логическое значение, по умолчанию: функция, возвращающая значение $.support.mediaquery Любые условия поддержки, которые должны быть выполнены, чтобы продолжить.

jQM предлагает Media Helpers, но он устарел, но вы все еще можетезагрузите его и используйте сами.

• http://jquerymobile.com/test/docs/api/mediahelpers.html

Они предлагают использовать response.js , разработанный Скоттом Джелом (член команды jQM)

Answer 2

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