zoukankan      html  css  js  c++  java
  • Javascript实现打开或退出浏览器全屏

    废话不多说,直接上代码:

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
     2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
     3 <head>
     4   <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
     5   <title>Document</title>
     6 </head>
     7 <body>
     8   <button id="open">全屏展示</button>
     9   <button id="close">退出全屏</button>
    10   <script type="text/javascript">
    11     var open = document.getElementById('open');
    12     var exit = document.getElementById('close');
    13 
    14     function openFullScreen() {
    15       var docElm = document.documentElement;
    16       // W3C
    17       if (docElm.requestFullscreen) {
    18         docElm.requestFullscreen();
    19       }
    20       // FireFox
    21       else if (docElm.mozRequestFullScreen) {
    22         docElm.mozRequestFullScreen();
    23       }
    24       // Chrome等
    25       else if (docElm.webkitRequestFullScreen) {
    26         docElm.webkitRequestFullScreen();
    27       }
    28       // IE11
    29       else if (elem.msRequestFullscreen) {
    30         elem.msRequestFullScreen();
    31       }
    32     }
    33 
    34     function exitFullScreen() {
    35       if (document.exitFullscreen) {
    36         document.exitFullscreen();
    37       } else if (document.mozCancelFullScreen) {
    38         document.mozCancelFullScreen();
    39       } else if (document.webkitCancelFullScreen) {
    40         document.webkitCancelFullScreen();
    41       } else if (document.msExitFullscreen) {
    42         document.msExitFullscreen();
    43       }
    44     }
    45     open.addEventListener('click', openFullScreen, false);
    46     exit.addEventListener('click', exitFullScreen, false);
    47   </script>
    48 </body>
    49 </html>
  • 相关阅读:
    房价
    Jsrender初体验
    GCD XOR UVA
    GCD
    Aladdin and the Flying Carpet LightOJ
    HDU6035 2017多校第一场1003 树形DP
    F
    C
    B
    An Easy Physics Problem HDU
  • 原文地址:https://www.cnblogs.com/jlienzen/p/5199923.html
Copyright © 2011-2022 走看看