RequestFullScreen iframe HTML5 content doesn't work on iOS App

Question

I have HTML5 content created with Adobe Captivate embedded in an iframe on my WordPress page with the HTML widget of Elementor page builder. In the HTML5 content I added a button with the Javascript RequestFullScreen API so that my users can focus on viewing the content.

We created the phone app for Android and iOS using a third-party plugin. In the app, the button does put the HTML5 content on full screen mode on Android devices but not iOS. Please see below for the code.

var docElm = document.documentElement;
if (docElm.requestFullscreen) {
  docElm.requestFullscreen();
} else if (docElm.mozRequestFullScreen) {
  docElm.mozRequestFullScreen();
} else if (docElm.webkitRequestFullScreen) {
  docElm.webkitRequestFullScreen();
} else if (docElm.msRequestFullscreen) {
  docElm.msRequestFullscreen();
}

I have never done app development until last week.

I did some research that iOS devices simply don't support the Javascript API. I am trying to look for solution but not able to get any tips. Can anybody suggest me a direction on what to do so my users can play the embedded HTML5 content on full screen on iOS app?

Thanks much, CK

Could be some useful info in this previous question https://stackoverflow.com/questions/12822739/full-screen-api-html5-and-safari-ios-6 — asking for a friend, Oct 07 '22 at 15:30

RequestFullScreen iframe HTML5 content doesn't work on iOS App

0 Answers0