检测iPhone浏览器中是否显示地址栏 [英] Detect if address bar is shown in iPhone browser

问题描述

当我正在显示iPhone浏览器中的地址栏时，我正试图以面向未来且与设备无关的方式进行检测。这是显示在顶部的工具栏，用于显示URL。它可以通过调用隐藏：

I'm trying to detect, in a future-proof and device-independent way, when the address bar in the iPhone browser is showing. This is the toolbar that is shown at the top in order to display the URL. It can be hidden by calling:

window.scrollTo(0, 0)

我想做的是检测它何时被显示（从而减少可用的观看空间）并设置一个计时器以便再次隐藏它等等。比这更频繁，它会非常烦人，因为用户将无法访问地址栏。

What I'd like to do, is detect when it's being show (thus reducing the available viewing space) and set a timer to hide it again a second or so later. Any more frequent than that and it'll be quite annoying since users won't be able to get to the address bar.

我试过检查 window.pageYOffset ，遗憾的是，如果网址栏的任何部分可见，则返回零。

I've tried checking window.pageYOffset, unfortunately, this returns zero if any part of the url bar is visible.

我不要想要对iPhone上的任何尺寸进行硬编码，并根据当前视口大小检查这些尺寸。它太脆弱了。

I don't want to hard code any dimensions on the iPhone and check those against the current viewport size. It's too fragile.

这里有人知道解决方案吗？

Anyone know a solution here?

推荐答案

您正在寻找 window.innerHeight 属性。这是屏幕上实际内容的高度。当顶部的工具栏可见时，它显着减少，因为内容的空间较小。有一个小问题，我似乎无法弄清楚我的iPhone 4 - window.innerHeight有时会在屏幕的某些滚动位置返回3个像素。

The window.innerHeight property is what you're looking for. This is the height of the actual content on the screen. It's significantly less when the toolbar at the top is visible, because there's less room for the content. There is a slight problem that I can't seem to figure out on my iPhone 4 - window.innerHeight sometimes returns 3 pixels less at certain scroll positions of the screen.

我已经为您设置了一个示例，它或多或少地提供了您的要求，至少应该让您开始：

I've set up an example for you that does more or less what you asked, it should at least get you started:

http://jsfiddle.net/rUSEb/show/light （在你的iphone上测试一下）。

http://jsfiddle.net/rUSEb/show/light (test it out on your iphone).

这篇关于检测iPhone浏览器中是否显示地址栏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！