IPad in full screen in Safari

Question

I am trying to get a website that works in full screen for all pages, I looked here: iPad WebApp Full Screen in Safari and followed it and my index page fills the screen only beautifully, but whenever I click on a link to another page , even if this page is configured using meta tags, it returns the chrome bar again and the alignment is aligned.

There must be a way or safari limitation that will be fixed in a later version.

Answer 1

I wrote a jQuery plugin for this purpose: https://github.com/mrmoses/jQuery.stayInWebApp

Turn on the plugin and then run it like this:

$(function() { $.stayInWebApp(); }); 

By default, it will be attached to all <a /> elements. You can pass another selector to attach it to specific links. For example, $.stayInWebApp('a.stay'); will be attached to all links that have class="stay"

Since it is so small, I usually just copy the mini version to one of my other external javascript files to include it, instead of adding another js external link.

Also available at plugins.jquery.com

Answer 2

You can try something like this:

 if ((navigator.userAgent.indexOf('iPad') != -1)) { // for standalone (app) fulscreen mode if (window.innerHeight == 748 || window.innerHeight == 1004) { var a = document.getElementsByTagName("a"); for (var i = 0, len = a.length; i < len; i++) { if (a[i].getAttribute("href");) { a[i].onclick = function() { window.location = this.getAttribute("href"); return false; } } } } }