对于我当前的移动Web项目,我使用meta"viewport"标记来指示移动浏览器使用设备宽度为1:1的比例:
<meta name="viewport" content="initial-scale=1.0, width=device-width, height=device-height, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
Run Code Online (Sandbox Code Playgroud)
这适用于IE移动设备,iPhone Safari甚至Opera 10测试版,但它不适用于Opera 9.7,默认安装在HTC HD2上.HTC HD2的设备尺寸为480x800,因此视口在纵向模式下的宽度应为480.但显然Opera mobile 9.7(也许也是9.5)设置了一个错误的宽度,所以之后一切都放大了一点.我用一个简短的javascript片段来检查实际的窗口大小:
$(window).width() - >返回274
window.innerWidth - >返回480
当我硬编码480而不是"设备宽度"时,一切正常.同样适用于横向模式:
$(window).width() - >返回457
window.innerWidth - >返回800
这有什么解决方法吗?
问候