Detect If Address Bar Is Shown In Iphone Browser

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

Solution 1:

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 (test it out on your iphone).