Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Open webpage in fullscreen in Safari on iOS

Tags:

There is a fullscreen mode in Safari on iOS. Is it possible to activate this through javascript or similar?

Thanks

like image 530
Eric Herlitz Avatar asked May 10 '13 15:05

Eric Herlitz


People also ask

How do I make Web pages full screen on iPhone?

(If your iPhone still has a home button, tap the home button and power button at the same time.) You'll see a capture of the site. Now, tap the screenshot on the lower left. Tap the “full page” option on the top.

How do I get my Safari page to open on full screen?

Tip. You may as well learn the keyboard shortcut for the Enter Full Screen mode: Control-⌘-F. The same keystroke leaves Full Screen mode, but you can also tap the Esc key for that purpose.


2 Answers

No, there is no way to toggle the fullscreen mode in Safari on iOS using javascript.

In order for a web page to run in fullscreen mode, you need to add the following meta tag, and the page needs to be started from a bookmark on the home screen:

<meta name="apple-mobile-web-app-capable" content="yes">

However, you can detect if the page is running in fullscreen mode or not with javascript using the read only property:

window.navigator.standalone
like image 76
Strille Avatar answered Sep 16 '22 15:09

Strille


Aftier iOS >= 12, There is only way to toggle to fullscreen through native API in Safari.

    if (document.webkitFullscreenElement) {
      document.webkitCancelFullScreen();
    } else {
      const el = document.documentElement;
      el.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
    }
like image 30
lqs469 Avatar answered Sep 20 '22 15:09

lqs469