iPhone Safari screen.availHeight和状态栏/ toolbar/addressbar

Question

我正试图在iPhone Safari中获得可用的屏幕尺寸,以便将容器缩小到屏幕的高度,减去状态栏和工具栏.

由于iOS始终返回屏幕尺寸,就像手机处于纵向一样,我使用screen.availWidth来计算横向高度.以下是返回的尺寸:

screen.width; //320
screen.availWidth; //300

20px差异占据了手机上的顶部状态栏,但没有考虑屏幕底部的按钮栏(工具栏).

我可以使用任何可以返回268px的属性吗？

我会做(screen.availWidth - 32),但用户可能会将该网站添加为桌面书签,在这种情况下,此栏将不会出现,300px值将是正确的.

Answer 1

我没有确切的答案,但您可以确定用户是在Mobile Safari中还是在带有navigator.standalone属性的桌面书签中.有了这个,您可以决定是否减去32px.

编辑:找到答案.使用<meta name="viewport" content="user-scalable=no, width=device-width, height=device-height" />然后可以获得正确的值window.innerWidth / window.innerHeight