webkitEnterFullScreen API is supported on iOS for video element, but not for a div element. Also as a fullscreen demo website shown, Safari on macOS supports div element but not on iOS.
Is there any plan to add the support in iOS? If not is there any way to fullscreen a div element or make it run as fullscreen on Safari iOS?
Please Apple, what are your developers doing? Allow Fullscreen API in DIV elements on iPhone.
Please we need Fullscreen API in DIV elements for iPhone!
Indeed we need this on iOS
According to the Browser Compatibility table on the Mozilla Developer Network, the Fullscreen API is only partially supported in Safari on iOS and uses a nonstandard name.
Hopefully, Apple allows this in the near future as they had in the past.
we need this, all other browsers support this. why apple does not support?
yes, what are the engineers doing everyday in Apple??? How incredible you don't make such easy api!!!
This. Is. Something. Required.
No progress?????
This is important. What's apple doing??
It's obviously a strategy from Apple to NOT support the Fullscreen API, it's now the only thing left that prevents people from making full-blown web-based games, and that would of course be a disaster for the App Store... Apple has sadly become the new Microsoft ;-( it breaks my heart...
This isn't even supported on a video element, maybe do that first????
Hi all! I have a little question: Where is the Fullscreen Api on ios 16.1? How can i turn it on?
Please bring back full-screen API. We can't use full-screen video mode on Google Drive. Everyone faces this problem only on iPhones. But with Other OS like Android, everything works perfectly. Please bring Full-Screen API on iOS.
Safari's Fullscreen API implementation was updated and unprefixed in Safari 16.4 on macOS and iPadOS.
Now, in Safari 17.2 beta, Fullscreen API is supported on iPhone.
We'd love to have you help test Safari 17.2 beta. If you find any issues, provide your feedback at bugs.webkit.org.
Hi @Apple Staff
I've been on linked 17.2 Beta Release Notes but I could not find any mention of fullscreen API. In particular, I'd like to understand what parts of API are implemented and what parts are not, or maybe partially implemented.
Where can I find more details? Thanks
You need to enable the Fullscreen API flag in Safari settings on your iPhone. It works, but it looks like it's not finished yet, as it has a few graphical bugs. In addition, there is a large "close" button in the corner of the screen.
I just update my iPhone iOS 17.2 and no full screen sadly :-( I wonder why it dropped off?
@michall12 or @dife,
How do you get this to work on an iPhone? I have enabled Settings | Safari | Advanced | Feature Flags | Fullscreen API, but divs or iframes do not have a .webkitEnterFullScreen (or .requestFullScreen for that matter). Is this available only for an HTMLVideoElement? If it does work on a normal div, how do you do it??
Today is February 22, 2024. For most of February so far, I've been happily testing the fullscreen javascript API with ordinary div elements in Safari on iPhone iOS 17.4 beta 3 (21e5200d). Possibly also in iOS 17.4 beta 2 and 1 before that, but I wasn't keeping track of the minor beta versions.
For me too, as forum user "dife"'s comment reports experiencing, Safari's fullscreen implementation placed a disruptive "X" overlay in the upper left hand corner. The "X" overlay is especially disruptive in portrait orientation on iPhone because there isn't much horizontal width for the "X" to get out of the way of the prime "real estate" for reading text at the top of the web page. To try to work around the "X", I was experimenting with adding an extra tall amount of top padding or margin to push the page's first text content below the "X". Also to limit use of that extra top whitespace to just iOS Safari, and just in fullscreen mode and portrait orientation, by detecting those conditions with media queries and javascript.
Notwithstanding this hopefully temporary "X" inconvenience, it's been a pleasure finally to be able to view my webpage in fullscreen on an iPhone. For years already the javascript fullscreen API has been working wonderfully in my Android phones' Chrome and Firefox browsers (without any intrusive "X" overlay [!]) and also in Safari on my iPad. On my iPad in Safari, the "X" overlay has always been present but is much less disruptive because there is a lot of width to work with for displaying text to the side of the "X" on an iPad, even in portrait orientation.
Sadly, I upgraded today to iPhone iOS 17.4 beta 4 (21E5209b), in which support for the fullscreen API seems to have gone away entirely. This must be due to what I see referenced in the release note in "Safari 17.4 Beta Release Notes Released February 20, 2024 — 17.4 beta (19618.1.15)", where it says "Fixed multiple issues by disabling support for the Fullscreen API on iOS. (122908994)". I hope Apple will soon figure these issues out and finally bestow to the World the fullscreen API in iOS Safari on iPhone!
Hi again. Does anyone have any news about this?
Safari Safari 17.5 beta went out and release notes mention nothing related to fullscreen.
Previous Safari 17.4 release notes contanis 8 fullscreen mentions, but none seems related to this issue.
For that matters, I cannot seems to find release notes for 17.4 intermediate beta releases, and the (in)famous statement "Fixed multiple issues by disabling support for the Fullscreen API on iOS" is absent in final release notes, so I might guess that statement has been reverted?
Still, I cannot figure out what to do of the last comment above by Apple Staff, the one at the bottom of page 1, starting with "Safari's Fullscreen API implementation was updated [...]".
This is soo sad.. it is almost 2025 now, still nothing works on an iPhone.. (not interested in using webkit prefix sh@# or browser flags) what the f@&$ is wrong with you Apple? user can decide when to start, when to leave.. no Problem in my opinion..
Seriously this is important Apple what are you doing? we need this for interactive elements that otherwise are impacted by the rest of the website. cmon!
