HTML DOM fullscreenEnabled()用法及代码示例

HTML DOM中的fullscreenEnabled()方法用于检查是否可以全屏模式查看文档。它返回一个只读的布尔值。此方法可能需要特定的前缀才能与不同的浏览器一起使用。

用法:

document.fullscreenEnabled()

参数：此方法不接受任何参数。

返回值：它返回布尔值：

True:是否可以全屏模式查看文档。
False:如果无法以全屏模式查看文档。

范例1：

<!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> 
            GeeksforGeeks 
        </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>

输出：
之前单击按钮：
check_fullscreen
单击按钮后：
check_fullscreen_output

范例2：

<!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>GeeksforGeeks</h1> 
          
        <h2> 
            HTML DOM fullscreenEnabled() method 
        </h2> 
          
        <img id = "image" src = 
"https://media.geeksforgeeks.org/wp-content/uploads/geeksforgeeks-logo.png" /> 
        <br> 
          
        <button onclick = "goFullScreen();"> 
            Fullscreen 
        </button> 
          
    </body> 
</html>

输出：
之前单击按钮：
go-fullscreen
单击按钮后：
go-fullscreen-output

支持的浏览器：下面列出了fullscreenEnabled()方法支持的浏览器：

Google Chrome 45.0 -webkit-
Firefox 47.0 -moz-
Internet Explorer 11.0 -ms-
苹果Safari 5.1 -webkit-
Opera 15.0 -webkit-

相关用法

注：本文由纯净天空筛选整理自sayantanm19大神的英文原创作品 HTML | DOM fullscreenEnabled() Method。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。