zoukankan      html  css  js  c++  java
  • js 全屏代码实现方法

     1 /* 全屏方法
     2  * =========
     3     <button class="roll-nav roll-right fullscreen">
     4         <i class="fa fa-arrows-alt"></i>
     5     </button>
     6 */
     7 +function ($) {
     8     'use strict';
     9 
    10     /* 
    11     * [setFullscreen 设置全屏] 
    12     * @param {domElement} element [DOM节点对象(可选)] 
    13     */
    14     var setFullscreen = function (element) {
    15         var el = element instanceof HTMLElement ? element : document.documentElement;
    16         var rfs = el.requestFullscreen || el.webkitRequestFullscreen || el.mozRequestFullScreen || el.msRequestFullscreen;
    17         if (rfs) {
    18             rfs.call(el);
    19         } else if (window.ActiveXObject) {
    20             var ws = new ActiveXObject("WScript.Shell");
    21             ws && ws.SendKeys("{F11}");
    22         }
    23     }
    24     /*
    25     * [exitFullscreen 退出全屏] 
    26     */
    27     var exitFullscreen = function () {
    28         var efs = document.exitFullscreen || document.webkitExitFullscreen || document.mozCancelFullScreen || document.msExitFullscreen;
    29         if (efs) {
    30             efs.call(document);
    31         } else if (window.ActiveXObject) {
    32             var ws = new ActiveXObject("WScript.Shell");
    33             ws && ws.SendKeys("{F11}");
    34         }
    35     }
    36 
    37     var isFullScreen = false;
    38     var handleFullScreen = function () {
    39         if (isFullScreen) {
    40             exitFullscreen();
    41             isFullScreen = false;
    42         } else {
    43             setFullscreen();
    44             isFullScreen = true;
    45         }
    46     }
    47 
    48     $("button.fullscreen").on('click', function (event) {
    49         handleFullScreen();
    50     });
    51 }(jQuery);
  • 相关阅读:
    mysql各版本特点
    jQuery 获取文件后缀的方法
    jquery中动态效果
    常用CSS缩写语法总结
    判断两个时间这间间隔几分钟
    jQuery操作Cookie
    禁止表单自动提示缓存数据
    jQuery.lazyload
    Jquery.Sorttable 桌面拖拽自定义
    分享13款非常有用的 jQuery 插件
  • 原文地址:https://www.cnblogs.com/wsk198726/p/11631488.html
Copyright © 2011-2022 走看看