Как сделать так, чтобы браузер Android отображал документ по размеру экрана?

Question

Я работаю над сайтом, который должен свободно масштабироваться до низких разрешений, чтобы он работал так же хорошо на телефоне.Это хорошо работает в Firefox и Chrome, когда я просто уменьшаю окно, но когда я пробую его на реальном телефоне Android (Nexus One под управлением Android 2.2), оно становится супер огромным!(Используя свойства JS window.innerWidth и window.innerHeight, кажется, что разрешение окна просмотра составляет 800x1271!)

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

Answer 1

Спасибо, что ответили на вашу собственную проблему - вы тоже нашли мое решение.

Просто дополнительная информация для всех, у кого похожая проблема, я получил следующие результаты, используя jQuery $(window).width() / $(window).height() на Nexus One под управлением Android 2.2.

Нет <meta name="viewport">

- портрет 800 x 1130, пейзаж 800 x 358

С <meta name="viewport" content="width=device-width">

- портрет 320 x 452, пейзаж 533 x 239

с <meta name="viewport" content="width=device-width, target-densityDpi=device-dpi">

- портрет 480 x 678, пейзаж 800 x 358 - реальные размеры в пикселях!

IЯ не смог протестировать его на iPhone: если кто-то захочет попробовать, тест будет здесь .

Answer 2

Решено самостоятельно.Решение состоит в том, чтобы добавить следующий код в заголовок:

<meta name="viewport" content="width = device-width">