js全屏

原创 2015年07月07日 14:06:08
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>微信墙</title>
    <link rel="stylesheet" type="text/css" href="css.css">
    <script type="text/javascript" src="images/jq.min.1.11.1.js"></script>
    <script type="text/javascript">

    (function(){
        var fullScreenApi = {
                supportsFullScreen: false,
                isFullScreen: function() { return false; },
                requestFullScreen: function() {},
                cancelFullScreen: function() {},
                fullScreenEventName: '',
                prefix: ''
            },
        browserPrefixes = 'webkit moz o ms khtml'.split(' ');
        // check for native support
        if (typeof document.cancelFullScreen != 'undefined') {
            fullScreenApi.supportsFullScreen = true;
        } else {
            // check for fullscreen support by vendor prefix
            for (var i = 0, il = browserPrefixes.length; i < il; i++ ) {
                fullScreenApi.prefix = browserPrefixes[i];
                if (typeof document[fullScreenApi.prefix + 'CancelFullScreen' ] != 'undefined' ) {
                    fullScreenApi.supportsFullScreen = true;
                    break;
                }
            }
        }
        // update methods to do something useful
        if (fullScreenApi.supportsFullScreen) {
            fullScreenApi.fullScreenEventName = fullScreenApi.prefix + 'fullscreenchange';
            fullScreenApi.isFullScreen = function() {
                switch (this.prefix) {
                    case '':
                        return document.fullScreen;
                    case 'webkit':
                        return document.webkitIsFullScreen;
                    default:
                        return document[this.prefix + 'FullScreen'];
                }
            }
            fullScreenApi.requestFullScreen = function(el) {
                return (this.prefix === '') ? el.requestFullScreen() : el[this.prefix + 'RequestFullScreen']();
            }
            fullScreenApi.cancelFullScreen = function(el) {
                return (this.prefix === '') ? document.cancelFullScreen() : document[this.prefix + 'CancelFullScreen']();
            }
        }
        // jQuery plugin
        if (typeof jQuery != 'undefined') {
            jQuery.fn.requestFullScreen = function() {
                return this.each(function() {
                    if (fullScreenApi.supportsFullScreen) {
                        fullScreenApi.requestFullScreen(this);
                    }
                });
            };
        }
        window.fullScreenApi = fullScreenApi;
    })();
    </script>
  </head>
  <body class="wx-wall" id="fullscreenbox">

  <div class="wx-wall-main" >
    
    </div>
    
    <div class="wx-wall-footer">
      <div class="footer-content">
        <div class="footer-notice">
          <div class="notice">
            <marquee></marquee>
          </div>
        </div>
        <div class="footer-menu">
          <ul>
            <li><a class="quanpin" title="全屏"  href="javascript:void(0)" id="fullscreenbtn"></a></li>
          </ul>
        </div>
      </div>
    </div>
  </div>
  </body>
<script type="text/javascript">



$(function(){
    $('#fullscreenbtn').click(function(){
        if(window.fullScreenApi.supportsFullScreen){
            window.fullScreenApi.requestFullScreen(document.getElementById('fullscreenbox'));
        }else{
            alert('就你这浏览器,基本就告别全屏功能了');
        }
    });
});
</script>
</html>

版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

js 全屏轮播

  • 2017-09-06 17:58
  • 8.05MB
  • 下载

jQuery全屏滚动插件fullPage.js

简介 如今我们经常能见到全屏网站,尤其是国外网站。这些网站用几幅很大的图片或色块做背景,再添加一些简单的内容,显得格外的高端大气上档次。比如 iPhone 5C 的介绍页面(查看),QQ浏览...

js全屏动态背景图片.rar

  • 2014-11-17 16:56
  • 2.33MB
  • 下载

jQuery全屏滚动插件FullPage.js中文帮助文档API

fullPage.js是一个基于jQuery的全屏滚动插件,它能够很方便、很轻松的制作出全屏网站。

JS实现全屏页面切换

以前在网上看到过一些全屏切换的页面,网上也有一些JQuery的插件能够实现全屏切换的效果,今天用原生js简单的做了一下这个效果。1.实现原理其实要做出这个效果还是挺简单的,下面来分析一下: 1.首先...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)