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!