关闭

js全屏

219人阅读 评论(0) 收藏 举报
分类:
<!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>

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    最新评论