网页切换全屏(浏览器F11效果)

 1 <!DOCTYPE html>
 2 <html lang="en">
 3   <head>
 4     <meta charset="UTF-8" />
 5     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 6     <meta http-equiv="X-UA-Compatible" content="ie=edge" />
 7     <title>Document</title>
 8   </head>
 9   <body>
10     <button onclick="toggleHandle()">全屏切换</button>
11     <script>
12       let fullscreen = false;
13       function toggleHandle() {
14         let element = document.documentElement;
15         if (this.fullscreen) {
16           if (document.exitFullscreen) {
17             document.exitFullscreen();
18           } else if (document.webkitCancelFullScreen) {
19             document.webkitCancelFullScreen();
20           } else if (document.mozCancelFullScreen) {
21             document.mozCancelFullScreen();
22           } else if (document.msExitFullscreen) {
23             document.msExitFullscreen();
24           }
25         } else {
26           if (element.requestFullscreen) {
27             element.requestFullscreen();
28           } else if (element.webkitRequestFullScreen) {
29             element.webkitRequestFullScreen();
30           } else if (element.mozRequestFullScreen) {
31             element.mozRequestFullScreen();
32           } else if (element.msRequestFullscreen) {
33             // IE11
34             element.msRequestFullscreen();
35           }
36         }
37         fullscreen = !fullscreen;
38       }
39     </script>
40   </body>
41 </html>

相关阅读:
JavaScript 移动端拖动元素
JavaScript轮播图
JavaScript缓动动画函数封装
JavaScript mouseenter和mouseover的区别
类欧几里得算法
AGC043 A~C 解题报告
「UOJ495」新年的促销
「BZOJ4842」Delight for a Cat
Atcoder AGC002 解题报告
Atcoder AGC001 解题报告

原文地址：https://www.cnblogs.com/strongerPian/p/13405174.html