HTML DOM fullscreenEnabled() Method

The fullscreenEnabled() method in HTML DOM is used to check the document can be viewed in full screen mode or not. It returns a single read-only Boolean value. This method may require specific prefixes to work with different browsers.

Syntax:

document.fullscreenEnabled()

Parameters: This method does not accept any parameters.

Return Value: It returns boolean value:

True: If the document can be viewed in full screen mode.
False: If the document cannot be viewed in full screen mode.

Example 1:

html

<!DOCTYPE html> 
<html> 
    <head> 
        <title> 
            HTML DOM fullscreenEnabled() method 
        </title> 
          
        <!-- script to check full screen enabled or not -->
        <script> 
            function requestFullScreen() { 
                let isFullscreenSupported = 
                  
                    /* Standard syntax */ 
                    (document.fullscreenEnabled ||  
                      
                    /* Chrome, Safari and Opera */ 
                    document.webkitFullscreenEnabled || 
                      
                     /* Firefox */ 
                    document.mozFullScreenEnabled || 
                      
                    /* IE/Edge */ 
                    document.msFullscreenEnabled); 
      
                document.querySelector('.isSupported').innerHTML  
                        = isFullscreenSupported; 
            } 
        </script> 
    </head> 
      
    <body> 
        <h1> 
            w3wiki 
        </h1> 
          
        <h2> 
            fullscreenEnabled() method 
        </h2> 
          
        <!-- script called here -->
        <button onclick="requestFullScreen();"> 
            Check fullscreen supported 
        </button> 
          
        <p>Fullscreen support:</p> 
          
        <div class="isSupported"></div> 
          
    </body> 
</html>                                 

Output: Before Click on the button:

After click on the button:

Example 2:

html

<!DOCTYPE html> 
<html> 
    <head> 
        <title> 
            HTML DOM fullscreenEnabled() method 
        </title> 
          
        <!-- script to enable full screen -->
        <script> 
            function goFullScreen() { 
                if ( 
                      
                    /* Standard syntax */ 
                    document.fullscreenEnabled ||  
                      
                    /* Chrome, Safari and Opera */ 
                    document.webkitFullscreenEnabled ||  
                      
                    /* Firefox */ 
                    document.mozFullScreenEnabled || 
                      
                    /* IE/Edge */ 
                    document.msFullscreenEnabled  
                ) { 
                    elem = document.querySelector('#image'); 
                    elem.requestFullscreen(); 
                } 
                else { 
                    console.log('Fullscreen not enabled') 
                } 
            } 
        </script> 
    </head> 
      
    <body> 
        <h1>w3wiki</h1> 
          
        <h2> 
            HTML DOM fullscreenEnabled() method 
        </h2> 
          
        <img id = "image" src = 
"https://media.w3wiki.net/wp-content/uploads/w3wiki-logo.png" /> 
        <br> 
          
        <button onclick = "goFullScreen();"> 
            Fullscreen 
        </button> 
          
    </body> 
</html>                     

Output: Before Click on the button:

After click on the button:

Supported Browsers: The browser supported by fullscreenEnabled() method are listed below:

Google Chrome 71 and above
Edge 12 and above
Firefox 64 and above
Internet Explorer 11.0 and above
Apple Safari 6 and above
Opera 58.0 and above

html

html

Contact Us