2010-03-30 4 views
5

Я разрабатываю сайт для мобильного доступа, и я хочу установить ширину, высоту и размер кнопок, чтобы они отображали заполнение экрана. Например, если пользователь использует HTC HD, весь экран будет 480x800 с кнопкой размером 240x200. Однако IE mobile и Opera загружают страницу с некоторым уровнем масштабирования, поэтому кнопки отображаются слишком большими или слишком маленькими. Как я могу либо прочитать текущий уровень масштабирования в javascript, либо установить его из javascript?Настройка уровня масштабирования в мобильном браузере

ответ

0

Вы не должны полагаться на использование JavaScript на мобильных устройствах, поскольку оно по-прежнему не поддерживается широко на всех телефонах. Вместо этого вы должны установить ширину страницы таким же, как ширина браузера, чтобы ваши страницы отображались со 100%, например. body {width: 100%; margin: 0; padding: 0;}

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

5

Посмотрите на <meta name="viewport">. Он поддерживается на самых разных мобильных платформах, включая (AFAIK) iPhone, Android, Blackberry, Opera Mobile и даже IE6 Mobile. В основном, он позволяет вам установить ширину устройства, уровень масштабирования и макс/мин. Посмотрите на Apple developer site и за дополнительной информацией.

Кроме того, вы можете использовать мультимедийные запросы CSS для определения формы и размера браузера и соответственно выполнять различные макеты (и т. Д.). Опять же, они довольно широко поддерживаются, и у Apple developer site есть дополнительная информация.

+0

Спасибо за это. Решил проблему для меня. –