Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

iPhone - Hide Address Bar on Page Load

I have a web page that is intended to be loaded on a person's iPhone. When the page is loaded, I want to hide the status and address bar that is at the top. I have seen other sites do this. In an attempt to accomplish this, I have placed the following code in the section of my web page:

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=yes;" />
<script type="text/javascript">
  function page_Load() {
    setTimeout(function() { window.scrollTo(0, 1); }, 100);
  }
</script>

The "page_Load" function is triggered through the onload event of the page's body element. Oddly, when the page loads, the status/title bar is hidden, however, not the address bar.

How do I hide both the status/title bar and the address bar when a web page loads?

Thank you!

like image 647
Villager Avatar asked Jun 26 '09 14:06

Villager


People also ask

How do I hide the address bar on my website?

To get started enter “about:flags” into the Address Bar and hit Enter. Scroll down until you see the listing for Compact Navigation. Enable it and let the browser restart to gain access to the feature. Once the browser has restarted right click on one of the tabs and select Hide the toolbar from the Context Menu.

How do I hide the URL bar in Safari?

Enter full screen mode, right-click anywhere around the address bar then click "Hide Toolbar" in the menu that appears. Although next time you enter full screen mode the toolbar comes back.


1 Answers

For those of you using jQuery here's an even simpler version:

$('body').scrollTop(1);
like image 117
rakaloof Avatar answered Oct 14 '22 15:10

rakaloof