<!DOCTYPE html>

 <html lang="en" id="div1">

 <head>

     <meta charset="UTF-8">

     <meta name="viewport" content="width=device-width, initial-scale=1.0">

     <meta http-equiv="X-UA-Compatible" content="ie=edge">

     <title>Document</title>

 </head>

 <body>

     <div style="background-color:red">

         <button onclick="openww()">新窗口</button>

         <button type="button" id="btn">全屏</button>

         <button type="button" id="btn2">退出全屏</button>

     </div>

 </body>

 <script>

     function openww() {

         // window.showModalDialog("./tanchuang01.html","Window", "height=100, width=400, toolbar= no, menubar=no, scrollbars=no, resizable=no, location=no, status=no,top=100,left=300");

         window.open("http://baidu.com", "_blank", 'example02', 'channelmode');

         // window.open ("./tanchuang01.html","newwindow","height=600,width=800");

         // window.open("./tanchuang01.html", "_blank", "height=100, width=400, toolbar= no, menubar=no, scrollbars=no, resizable=no, location=no, status=no,top=100,left=300")

         // window.open('./tanchuang01.html', 'newwindow', 'height=100,width=400,top=0,left=0,toolbar=no,menubar=no,fullscreen=1,scrollbars=no, resizable=no,location=no, status=no,directories=no')

     }

     //全屏功能

     document.getElementById("btn").onclick = function () {

         var elem = document.getElementById("div1");

         // elem.style.width = "100%";

         // elem.style.height = "100%";

         // elem.style.overflowY = "scroll";

         requestFullScreen(elem); // 某个页面元素

         //requestFullScreen(document.documentElement); // 整个网页

     };

     function requestFullScreen(element) {

         // 判断各种浏览器，找到正确的方法

         var requestMethod = element.requestFullScreen || //W3C

             element.webkitRequestFullScreen || //FireFox

             element.mozRequestFullScreen || //Chrome等

             element.msRequestFullscreen; //IE11

         if (requestMethod) {

             requestMethod.call(element);

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

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

             if (wscript !== null) {

                 wscript.SendKeys("{F11}");

             }

         }

     }

     //退出全屏 判断浏览器种类

     document.getElementById("btn2").onclick = function () {

         exitFull();

     };

     function exitFull() {

         // 判断各种浏览器，找到正确的方法

         var exitMethod = document.exitFullscreen || //W3C

             document.mozCancelFullScreen || //FireFox

             document.webkitExitFullscreen || //Chrome等

             document.msExitFullscreen; //IE11

         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}");

             }

         }

     }

 </script>

 </html>

js 实现操作浏览器或者元素的全屏与退出全屏功能的更多相关文章

  1. JS实现元素的全屏、退出全屏功能

     在实际开发中,我们很可能需要实现某一元素的全屏和退出全屏功能,如canvas.所幸的是,js提供了相关api用来处理这一问题,只需简单的调用requestFullScreen.exitFullScr ...

  2. js控制全屏及退出全屏

    js控制全屏及退出全屏,网上很多代码例子,我这里需求和标准的有点出入: 1.当用户点击某按钮,触发iframe下的页面全屏. 2.不允许用户退出全屏. 解决第一点,触发全屏可以按照网上的例子,代码如下 ...

  3. div的全屏与退出全屏

    div的全屏与退出全屏 作用:将div全屏与退出全屏,一般播放器使用较多. html按钮: <button onclick="showFull();"> 全屏 < ...

  4. android开发：全屏和退出全屏

    android开发:全屏和退出全屏 from://http://blog.csdn.net/dyllove98/article/details/8831933 2013-04-21 20:31 413 ...

  5. js之切换全屏和退出全屏实现

    应用场景:比如很多网页游戏全屏之类的,或者是网上看小说等. 核心代码: //控制全屏 function enterfullscreen() { //进入全屏 $("#fullscreen&q ...

  6. Android动态的全屏和退出全屏

    转自:http://chroya.iteye.com/blog/974031 让程序全屏的方法,大家都知道,那是静态的,程序运行之初就申明了.但是如果有这样的需求:要在程序运行的过程中,执行了某个操作 ...

  7. ng2 中的全屏与退出全屏

    1.进入全屏 launchFullscreen(element) { if(element.requestFullscreen) { element.requestFullscreen(); } el ...

  8. Cordova 设置全屏及退出全屏切换

    设置全屏在super.init();之前 最后才退出全屏. 以下为具体代码: package com.agile.ittm; import android.os.Bundle; import andr ...

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

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

随机推荐

  1. shell脚本中给字符串添加颜色

    shell脚本中echo显示内容带颜色显示,echo显示带颜色,需要使用参数-e 格式如下: echo -e "\033[字背景颜色:文字颜色m字符串\033[0m" 例如: ec ...

  2. Java面试题之多线程打印

    概述 作为程序员经常在面试的时候遇到多线程的问题,我印象比较深刻的就是下面这道题:写两个线程,一个线程打印 1~52,另一个线程打印字母A-Z.打印顺序为12A34B56C……5152Z.看这个题目已 ...

  3. 机器学习 xgboost 笔记

    一.数据预处理.特征工程 类别变量 labelencoder就够了,使用onehotencoder反而会降低性能.其他处理方式还有均值编码(对于存在大量分类的特征,通过监督学习,生成数值变量).转换处 ...

  4. SQL-55 分页查询employees表，每5行一页，返回第2页的数据

    题目描述 分页查询employees表,每5行一页,返回第2页的数据CREATE TABLE `employees` (`emp_no` int(11) NOT NULL,`birth_date` d ...

  5. angular 定时函数

    注入$interval,$timeout   服务 2.定义函数 var aa = $interval(function(){ $timout(function(){ ..... }) },,定时时间 ...

  6. Android中的几个基本常用控件

    Android 中常用的几大UI控件 1. TextView : 用于在界面中显示一段文本信息 <TextView android:id="@+id/text_view" / ...

  7. ubuntu安装后问题

    ubuntu安装后桌面显示不正常,出现闪屏,或者是缺图标的问题多数是ubuntu的3D加速显示问题 解决方法,vmware workstations 中的菜单栏:虚拟机->设置->显示器- ...

  8. Ceph集群更换public_network网络

    1.确保ceph集群是连通状态 这里,可以先把机器配置为以前的x.x.x.x的网络,确保ceph集群是可以通的.这里可以执行下面的命令查看是否连通,显示HEALTH_OK则表示连通 2.获取monma ...

  9. java虚拟机——垃圾回收机制

    问题1:什么是垃圾回收机制? 在java的虚拟机当中,在我们进行实例化的时候,堆会给我们开辟新的空间存放实例.而由于堆,方法区是线程公有,不会像栈区(线程私有)一样随着线程的销毁而销毁.因此在java ...

  10. 第二次靶场练习：cookie注入

    cookie注入 本文章目的是对相关的黑客内容进一步了解,如有人违反相关的法律法规,本人概不负责 一.学习目的: 利用手工注入网站 利用sqlmab注入 二.附件说明 靶场网址:http://120. ...