How to exit fullscreen onclick using Javascript?

Question

Not sure if the following code snip will work embedded on SO, as it didn\'t work when pasting it, however it does work stand-alone.

The problem, is I want this to be a t

Answer 1

Solutions provided here are incredibly long. You can use these few lines to show or cancel fullscreen.

Show full screen:

  /* You can use any HTML element through JS selector functions
   * eg. document.querySelector(".example");
  */
const element = document; 
const requestFullScreen = element.requestFullscreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen;
requestFullScreen.call(element);

Cancel full screen:

// As correctly mentioned in the accepted answer, exitFullscreen only works on document
const cancellFullScreen = document.exitFullscreen || document.mozCancelFullScreen || document.webkitExitFullscreen || document.msExitFullscreen;
cancellFullScreen.call(document);

Chrome will display an error: Uncaught (in promise) TypeError: Document not active if exitFullscreen is called while not in fullscreen mode.