Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Hide the iPhone status bar in a web application?

Is there a way to disable the status bar in iPhone web apps? I'm working on something that requires a fixed, fullscreen view, and the status bar is rather annoying.

like image 289
Stefan Kendall Avatar asked May 23 '10 23:05

Stefan Kendall


3 Answers

This is not possible.

like image 51
Stefan Kendall Avatar answered Nov 13 '22 12:11

Stefan Kendall


Unfortunatly, no. There are only two options black and black-translucent. Just note that with black-translucent part of the web frame will be partially visible under the status bar while using black actually pushes the web frame down so it's height is a little smaller.

This is what Apple says in their documentation:

<meta name="apple-mobile-web-app-status-bar-style" content="black">

This meta tag has no effect unless you first specify full-screen mode as described in “apple-mobile-web-app-capable.”

If content is set to default, the status bar appears normal. If set to black, the status bar has a black background. If set to black-translucent, the status bar is black and translucent. If set to default or black, the web content is displayed below the status bar. If set to black-translucent, the web content is displayed on the entire screen, partially obscured by the status bar. The default value is default.

like image 28
Ryan Avatar answered Nov 13 '22 12:11

Ryan


I've seen that you might have to remove the web application from your home screen, and then add it again, if you've added the meta tag, for it to make any difference. Worked for me.

like image 2
Tobias Teleman Avatar answered Nov 13 '22 12:11

Tobias Teleman