I am using the HTML5 fullscreen API so users can view my website in fullscreen, however when a user clicks a link (such as a menu item) the user switches back to the normal browser mode. How can I keep the browser in fullscreen when the user clicks certain links? Preferably without having to convert the whole website to an AJAX page load system.
The Fullscreen API adds methods to present a specific Element (and its descendants) in fullscreen mode, and to exit fullscreen mode once it is no longer needed.
Full-screen can be activated for the whole browser window by pressing the F11 key. It can be exited by pressing the Esc button.
You'll want a fixed position element at 100% width and height , if you don't have a background color or image you'll be able to click through it. Set z-index higher then all other elements to ensure it is at the front if you need that.
It will not be possible to do this without converting to an AJAX loading system. When you navigate to a different page, the DOM tree is destroyed, but the element you are putting into fullscreen mode is part of said DOM tree.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With