<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>quanping</title>

</head>

<body>

    <div id="div" onclick="fullScreen()">全屏</div>

    <div onclick="exitFull()">退出全屏</div>

    <script type="text/javascript">

        function fullScreen(){

            var el = document.documentElement;

            var rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullscreen;

                if(typeof rfs != "undefined" && rfs) {

                    rfs.call(el);

                };

              return;

        }

        function exitFull() {

         var exitMethod = document.exitFullscreen ||

         document.mozCancelFullScreen ||

         document.webkitExitFullscreen ||

         document.msExitFullscreen;

         if (exitMethod) {

          exitMethod.call(document);

         }

         else if (typeof window.ActiveXObject !== "undefined") {//for Internet Explorer

          var wscript = new ActiveXObject("WScript.Shell");

          if (wscript !== null) {

           wscript.SendKeys("{F11}");

          }

         }

        }

        document.getElementById('div').click();

    </script>

</body>

</html>

本示例可实现点击全屏效果，但是这个API接口不能实现，页面加载完成就执行全屏的效果

js 实现浏览器全屏效果的更多相关文章

  1. HTML5 JS 实现浏览器全屏(F11的效果)

    项目中有需要使用JS来控制浏览器全屏的方法 DEMO地址: http://zhongxia245.github.io/demo/js2fullpanel.html function fullScree ...

  2. 用html5(requestFullscreen) js实现点击一个按钮使浏览器全屏效果

    项目中需要将后台浏览器的窗口全屏,也就是我们点击一个按钮要实现按F11全屏的效果. 在HTML5中,W3C制定了关于全屏的API,就可以实现全屏幕的效果,也可以让页面中的图片,视频等全屏目前只有goo ...

  3. 用html5 js实现浏览器全屏

    项目中需要将后台浏览器的窗口全屏,也就是我们点击一个按钮要实现按F11全屏的效果. 在HTML5中,W3C制定了关于全屏的API,就可以实现全屏幕的效果,也可以让页面中的图片,视频等全屏目前只有goo ...

  4. [JavaScript] 用html5 js实现浏览器全屏

    项目中需要将后台浏览器的窗口全屏,也就是我们点击一个按钮要实现按F11全屏的 效果. 在HTML5中,W3C制定了关于全屏的API,就可以实现全屏幕的效果,也可以 让页面中的图片,视频等全屏目前只有g ...

  5. html5 js实现浏览器全屏

    全屏 var docElm = document.documentElement; //W3C if (docElm.requestFullscreen) { docElm.requestFullsc ...

  6. js控制浏览器全屏

    HTML 5中的full screen,目前可以在除IE和opera外的浏览器中使用 ,有的时候用来做全屏API,游戏呀,等都很有用.先看常见的API element.requestFullScree ...

  7. Jquery和JS实现浏览器全屏

    var fullscreen=function(){ elem=document.body; if(elem.webkitRequestFullScreen){ elem.webkitRequestF ...

  8. 原生js实现浏览器全屏和退出全屏

    全屏模式 //W3C if (docElm.requestFullscreen) { docElm.requestFullscreen(); } //FireFox else if (docElm.m ...

  9. 兼容IE浏览器的js浏览器全屏代码

    众所周知,IE是个奇葩的浏览器,但是由于用户量很大,开发者还是不得不为IE考虑一下,于是,各种浏览器相关的操作,都要多一个特别的判断——专门针对IE浏览器的判断,这里的全屏也不例外.看代码: func ...

随机推荐

  1. Markdown使用说明

    # Markdown 使用说明 Markdown 是一种**轻量级标记语言** 使用规则: 1. 标题   2. 列表 3. 引用 4. 图片与链接 5. 粗体与斜体 6.表格 7. 代码框 8. 分 ...

  2. 2020ubuntu1804server编译安装redis5笔记（二）配置redis

    前一篇笔记记录了ubuntu1804server编译安装redis5,接下来要配置redis5了 网址:https://www.cnblogs.com/qumogu/p/12435694.html 第 ...

  3. 免ROOT卸载手机自带软件详细教程

    一.准备条件 1.电脑一台 2.手机一部 3.WiFi 二.下载所需资源 微信扫码进入搜索,选择安卓软件卸载工具 根据图中提示,按照自己的系统进行下载 三.下载完后解压(以Windows为例),解压后 ...

  4. ubuntu与windows相关配置内容

    安装.配置.启动FTP服务 执行以下命令安装,安装后即会自动运行: sudo apt-get install vsftpd 修改vcftpd的配置文件/etc/vsftpd.conf,将下面几行前面的 ...

  5. XMind ZEN 2020 (10.0.2) 全平台 完美破解版(ubuntu)

    XMind ZEN 2020 (10.0.2) 全平台 完美破解版(ubuntu) https://www.ghpym.com/xmindzen.html/comment-page-8?replyto ...

  6. token iviewAdmin + php 登录验证解决方案

    思路: php 开启 Session 登录时 生成token,前端存下,然后每次走接口 验证下Session里的token和前端发过来的token是否一样. 遇到问题:后端 每次PHP Session ...

  7. MySQL笔记（6）-- SQL更新语句日志系统流程

    一.背景 在上一篇[MySQL笔记(5)-- SQL执行流程,MySQL体系结构]中讲述了select查询语句在MySQL体系中的运行流程,从连接器开始,到分析器.优化器.执行器等,最后到达存储引擎. ...

  8. python https请求报错：SSLCertVerificationError: [SSL: CERTIFICATE_VERIFY_FAILED]

    python爬虫,使用requests库发送https请求报错:SSLCertVerificationError: [SSL: CERTIFICATE_VERIFY_FAILED] 解决方法: imp ...

  9. SpringBoot怎么自动部署到内置的Tomcat的？

    先看看SpringBoot的主配置类的main方法: main方法运行了一个run()方法,进去run方法看一下: /** * 静态帮助程序,可用于从中运行{@link SpringApplicati ...

  10. settings插拔式源码

    创建一个文件夹notify __init__.py import settings import importlib def send_all(content): for path_str in se ...