I have a page that's intended to be put in full sc...
# javascript
d
I have a page that's intended to be put in full screen mode by the user. As you may know, in Chrome and I think most other browsers, you can't go to full screen automatically on load with js, it has to be in response to a user action. The trick is how to refresh the page without taking it out of full screen. I tried the js below to refresh the content of the page via ajax instead of reloading or submitting it. The code works I think, but the page still gets knocked out of full screen mode. Thoughts?
Copy code
function loadPage(url)
{
  fetch(url)
  .then(response => response.text())
  .then(data => {
    document.documentElement.innerHTML = data;
  })
  .catch(error => {
    console.error('Error:', error);
  });
}
loadPage(document.URL);
It appears that similar code can replace other parts of the page without losing full screen, but replacing the element that's full screen, which is what needs to refresh, ends full screen mode. Makes sense on a gut level, but I'm not sure how else to accomplish refreshing the part of the pg the user is looking at. I can try splitting up the page and replacing a child of the full screen-ed element, see if that helps.
For anyone still watching this, the simple key here is to not replace the actual element that's full screen. In my case, the full screen element is an html table, and I can replace its tbody via ajax without getting kicked out of full screen mode. Works perfectly, since the tbody includes all the content that may have changed.
👍 2