# Fullscreen

JavaScript Fullscreen API examples

***

## Enter fullscreen mode

> Switch browser to fullscreen mode. [Source](https://javascriptf1.com/snippet/switch-browser-to-fullscreen-mode-with-javascript)
>
> * Example:
>
>   ```javascript
>   document.documentElement.requestFullscreen();
>   ```

***

## Exit from fullscreen mode

> Exit from the fullscreen mode. [Source](https://javascriptf1.com/snippet/exit-from-fullscreen-mode-on-click-in-javascript)
>
> * Example:
>
>   ```javascript
>   const exitBtn = document.getElementById('exit-btn');
>
>   exitBtn.addEventListener('click', ()=>{
>       if (document.fullscreenElement) {
>           document.exitFullscreen();
>       }
>   });
>   ```

***

## Detect fullscreen mode

> Detect if fullscreen mode is active. [Source](https://javascriptf1.com/snippet/detect-fullscreen-mode-with-javascript)
>
> * Example:
>
>   ```javascript
>   window.addEventListener('resize', (evt) => {
>       if (window.innerHeight == screen.height) {
>           console.log('FULL SCREEN');
>       } else {
>           console.log('NORMAL SCREEN');
>       }
>   });
>   ```

***

## Toggle fullscreen mode

> Toggle fullscreen mode. [Source](https://javascriptf1.com/snippet/toggle-fullscreen-and-normal-mode-with-javascript)
>
> * Example:
>
>   ```javascript
>   const toggleBtn = document.getElementById('toggle-btn');
>
>   toggleBtn.addEventListener('click', () => {
>     if (!document.fullscreenElement) {
>         document.documentElement.requestFullscreen();
>     } else {
>       if (document.exitFullscreen) {
>         document.exitFullscreen();
>       }
>     }
>   }
>   ```

***