Search code examples
ipadweb-applicationssafarimobile-safariiphone-standalone-web-app

iPad WebApp Full Screen not working

My site used to work in full screen when I created a Web App for it, however lately it doesn't show in full screen anymore. Is there something that has changed with the new iOS version or a new Safari version?

I still have the meta tag : <meta name="apple-mobile-web-app-capable" content="yes">

Just to confirm, I am refreshing the website and adding the bookmark to the home screen. I can't seem to figure out what has changed.

Thanks RF

Solution

  • This is a subject that gives us a lot of problems whenever IOS is updated. So now iOS 9 is here we have once again been searching for answers. I am happy to say we have found a fix and it may well work for you too.

    For iOS 8 we found that adding the following meta tag

    <meta name="viewport" content="width=device-width,initial-scale=1.0,minimal-ui">

    ... and scrolling the page about a bit and back to the top using JS would do the trick - which no longer works with iOS9

    window.scrollTo(0, 1);
window.scrollTo(0, 200);
setTimeout(function() {
    window.scrollTo(0, 1);
}, 100);

    But, what we have now found is that changing the meta tag slightly has once again rectified the problem (notice the scale):

    <meta name="viewport" content="width=device-width,initial-scale=1.01,minimal-ui">