如何让Android浏览器以屏幕尺寸呈现文档?
问题描述:
我正在研究一个网站,该网站应该可以流畅地缩放到低分辨率,以便在手机上也能正常工作。这在Firefox和Chrome中运行良好,当我将窗口变小时,但是当我在实际的Android手机(运行Android 2.2的Nexus One)上试用它时,它呈现超级巨大! (使用JS的window.innerWidth和window.innerHeight属性,它似乎它报告的视口分辨率是800x1271!)如何让Android浏览器以屏幕尺寸呈现文档?
有没有一种方法在浏览器窗口中以实际大小呈现页面,以便我可以让我的完整设计在电话中显示?用户代理嗅探是允许的,JS允许但不鼓励。
答
解决我自己的。解决方案是将以下代码添加到标题中:
<meta name="viewport" content="width = device-width">
答
感谢您回答您自己的问题 - 您也让我了解我的解决方案。
对于有类似问题的其他人来说,我只是在运行Android 2.2的Nexus One上使用jQuery $(window).width()
/$(window).height()
得到以下结果。
没有<meta name="viewport">
- 肖像为800 x 1130,景观为800 x 358
随着<meta name="viewport" content="width=device-width">
- 人像320×452,景观533 X 239
随着<meta name="viewport" content="width=device-width, target-densityDpi=device-dpi">
- 纵向480 x 678,横向800 x 358 - 真正的像素尺寸!
我还没有能够在iPhone上测试它:如果有人想尝试,测试是here。
嗯,仍然不是我正在寻找的 - 报告的窗口尺寸现在会随着缩放而变化。可能有效,但不是我期待的... – ChrisV 2010-11-02 12:46:42