ohm*_*mer 26 javascript iphone ios
我正在使用window.innerHeight和window.innerWidth指令来获取浏览器的可用窗口大小.它正在使用firefox,safari(在Mac上)和android,但我在iOS中得到了奇怪的结果.
iOS始终返回innerHeight = 1091和innerWidth = 980.
我正在使用iOS SDK中的iOS模拟器(我没有iPhone/iPod).iPhone和iPhone Retina仿真器返回相同的值.我不明白他们如何能够返回相同的数字,因为2个模型有2种不同的屏幕分辨率.
我使用viewport参数但没有成功.
Jac*_*uen 23
TL;DR:使用document.documentElement.clientHeight/Width
这不完全是问题的答案,但如果您尝试根据浏览器中显示的文档大小执行操作,它会提供有用的信息。
window.innerWidth(和高度)在移动浏览器上可能会变得古怪,即使您使用正确的视口元标记。在某些浏览器上,它可能非常不一致。
screen.width对于移动浏览器效果更好,但是您需要考虑方向以及浏览器是移动浏览器还是桌面浏览器(如果您需要对两者都做出响应),因为screen.width与window.innerWidth.
根据我的经验,这document.documentElement.clientWidth是最好的方法。移动浏览器对于此属性的一致性比 for 更加一致window.innerWidth,并且由于您处理的是 html 元素的尺寸而不是浏览器窗口或设备屏幕,因此移动设备和桌面设备之间是一致的,并且不需要考虑方向为了。
Sen*_*nya 16
尝试使用screen.width而不是window.innerWidth.
<script>
if (screen.width > 650) {
....
}
</script>
Run Code Online (Sandbox Code Playgroud)
加
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no">
Run Code Online (Sandbox Code Playgroud)
对<head>元素.这将解决innerWidth问题.
视网膜具有高密度像素 - 基本上是4个硬件像素到1个逻辑像素.这就是他们报告相同分辨率的原因.
被卡在同一问题上。这是对我有用的解决方案。
首先,我要检测客户端是否是iOS设备。然后我使用Screen界面获取正确的值
var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
var iw = (iOS) ? screen.width : window.innerWidth, ih = (iOS) ? screen.height : window.innerHeight;
Run Code Online (Sandbox Code Playgroud)
查看 Apple 的文档,了解如何设置 Mobile Safari 的视口及其缩放方式:http://developer.apple.com/library/safari/#documentation/appleapplications/reference/safariwebcontent/UsingtheViewport/UsingtheViewport.html
基本上,您可以设置视口的比例,并通过在 HTML 页面上设置元标记将其默认为您想要的任何比例。
| 归档时间: |
|
| 查看次数: |
37919 次 |
| 最近记录: |