Categories
JavaScript Answers

How to use Chrome Fullscreen API with JavaScript?

Spread the love

Sometimes, we want to use Chrome Fullscreen API with JavaScript.

In this article, we’ll look at how to use Chrome Fullscreen API with JavaScript.

How to use Chrome Fullscreen API with JavaScript?

To use Chrome Fullscreen API with JavaScript, we use a few properties in an element.

For instance, we write

const toggleFullScreen = () => {
  if (!document.fullscreenElement) {
    document.documentElement.requestFullscreen();
  } else {
    document.exitFullscreen();
  }
};

to define the toggleFullScreen function.

In it, we check if the document isn’t full screen with document.fullscreenElement.

If it’s false, we request it to be full screen with document.documentElement.requestFullscreen.

Otherwise, we call document.exitFullscreen to exit full screen mode.

Conclusion

To use Chrome Fullscreen API with JavaScript, we use a few properties in an element.

Leave a Reply

Your email address will not be published.

If you like the content of this blog, subscribe to my email list to get exclusive articles not available to anyone else.