zoukankan      html  css  js  c++  java
  • js 实现全屏预览(F11功能)--转

    可参考文档:http://blog.csdn.net/tywali/article/details/8623938

    js代码

     1 function fullScreen(el) {  
     2     var rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullScreen,  
     3         wscript;  
     4    
     5     if(typeof rfs != "undefined" && rfs) {  
     6         rfs.call(el);  
     7         return;  
     8     }  
     9    
    10     if(typeof window.ActiveXObject != "undefined") {  
    11         wscript = new ActiveXObject("WScript.Shell");  
    12         if(wscript) {  
    13             wscript.SendKeys("{F11}");  
    14         }  
    15     }  
    16 }  
    17   
    18 function exitFullScreen(el) {  
    19     var el= document,  
    20         cfs = el.cancelFullScreen || el.webkitCancelFullScreen || el.mozCancelFullScreen || el.exitFullScreen,  
    21         wscript;  
    22    
    23     if (typeof cfs != "undefined" && cfs) {  
    24       cfs.call(el);  
    25       return;  
    26     }  
    27    
    28     if (typeof window.ActiveXObject != "undefined") {  
    29         wscript = new ActiveXObject("WScript.Shell");  
    30         if (wscript != null) {  
    31             wscript.SendKeys("{F11}");  
    32         }  
    33   }  
    34 }  

    html 代码

    1 <button id='btn'>全屏按钮</button>  
    2         <div id="content" style="background:yellow;500px;height:500px;">sljfsdlfj  
    3             <div id="quite" class="btn">退出全屏</div>  
    4         </div>  

    调用

    var btn = document.getElementById('btn');  
            var content = document.getElementById('content');  
            btn.onclick = function(){  
                fullScreen(content);  
            }  
            var quite = document.getElementById('quite');  
            quite.onclick = function(){  
                exitFullScreen();  
            }
    

      不仅可以实现整个document 全屏预览 还能实现特定的div来进行全屏预览

    转:http://blog.csdn.net/wu595679200/article/details/51195142

  • 相关阅读:
    JMS(面向消息中间件)
    ActiveMQ消息中间件知识汇总
    linux安装mysql常见命令
    结果集耗尽时,检查是否关闭结果集时常用sql
    Spring注解驱动开发之事务概念
    nginx 基础
    HTTP原理
    MYSQL----cmake 数据库出错
    php安装Phalcon模块
    docker报错 Failed to start Docker Application Container Engine.
  • 原文地址:https://www.cnblogs.com/ghfjj/p/6322415.html
Copyright © 2011-2022 走看看