Hide address bar in mobile device browser

Prabhat picture Prabhat · May 2, 2011 · Viewed 54.8k times · Source

I know 1 way of doing this.

<body onload="setTimeout(function() {window.scrollTo(0, 1)}, 100)">
...
</body>

But this works only if the page is big enough to be scrolled. If the page fits the screen the above function wont work. How to hide the address bar in this case ? I need to get it to work with iphone, ipad, android devices.

Answer

Tom Claus picture Tom Claus · May 2, 2011

Maybe you can set the minheight on the body bigger. 480px screen height in vertical mode + 60px address bar height = 540px.

Example:

body { min-height:540px; }     
body[orient="portrait"] { min-height:540px; }
body[orient="landscape"] { min-height:400px; }