#    
#  Overview

In this shot, we will learn how to get *into* full screen mode using the DOM **`requestFullscreen()` method**. This method is applied on the root element of the document that is `<html>`.

To get *out of* full screen mode, there is another method that will exit the full screen. We will use the **`exitFullscreen()` method** on the document object.

##   
## Example

Let's try to make our screen turn full screen after we click the button.

<!DOCTYPE html>
<html>
<body>

<p>Hey for Fullscreen click on the button `Fullscreen`, if you want to exit the fullscree click on the button 'Exit fullscreen'.</p>

<button onclick="big();">Fullscreen</button>
<button onclick="exit();">Exit Fullscreen</button>

<script>
var elem = document.documentElement;
function big() {
    elem.requestFullscreen();
}

function exit() {
    document.exitFullscreen();
}
</script>

</body>
</html>

codemirror

#    
#  Explanation

* In line 5, we have a paragraph tag with some text to display.

* In line 7, we wrote a button tag that has a function `big()` binded with the `onclick` event.

* In line 8, we have another button element that has a function `exit()` binded with the `onclick` event.

* In line 11, `document.documentElement` returns the `root` element that is `<html>`.

* In line 12, we defined the function `big()`. In this method, we will call the method `requestFullscreen()` on the root element `<html>`.

* In line 16, we defined the function `exit()`. In this method, we will call the method `exitFullscreen()` on the document, which will close the full screen if the document is in full screen.

##  
## Output

The above code will not work on the Educative platform. Please create a simple file with the `.html` extension and paste this code. Open this file in your browser.

Now, if we click the `Fullscreen` button, the window size gets bigger. When we are in full screen mode and click `Exit Fullscreen`, it makes the window return to its original size. 

What are requestFullscreen() and exitFullscreen() in DOM?

requestFullscreen() makes the root element enter full screen, while exitFullscreen() exits full screen mode.