Question

I am trying to hide the address bar for a webpage. On Iphone 4 and lower it works using

window.scrollTo(0,1);

and meta tags
.
But for IOS 6, these do not seem to work. I have checked other similar questions in stackoverflow, but could not find a solution that works. Has anyone faced a similar issue? If yes, is there any solution other than adding the site to the Home Screen as a web app and then launching from there.

Thank you.

Answer 1

After playing around with the script I noticed the following:
The address bar hides whenever I reload the page.
So as a workaround to this problem, I trigger the reload event (through a resize function ) and do window.scroll(0,1) in the resize function.

I have a function

var hideAddressBar = function() {
   if(document.documentElement.scrollHeight<window.outerHeight/window.devicePixelRatio)
   document.documentElement.style.height=(window.outerHeight/window.devicePixelRatio)+'px';
   setTimeout(function() {
       window.scrollTo(1,1)
   }, 0);

   if(navigator.userAgent.match(/Android|iPhone/gi)){
      window.scrollTo(0,1);
   }
}

I initially was calling this function only on the Onload event. Tis was working for ios 5 but not for ios6. I realized that in my script there is a resize function being called after rendering the page. So i made an call to the hideaddressbar function at the end of resize. So you may want to check in your script if, after rendering the page are you resizing or reloading again? If so, then call the hideAddressBar after it is done reloading. I hope this solves your problem.