H5實現全屏與F11全屏

最近做項目用到全屏，現總結一下全屏：

1.局部全屏：H5全屏和F11有區別，在這種情況下判斷全屏只需要通過H5全屏屬性，無論全屏后有無滾動條都可判斷。

         /**
         * [isFullscreen 判斷瀏覽器是否全屏]
         * @return [全屏則返回當前調用全屏的元素,不全屏返回false]
         */
        function isFullscreen(){
            return document.fullscreenElement    ||
                   document.msFullscreenElement  ||
                   document.mozFullScreenElement ||
                   document.webkitFullscreenElement || false;
        }

2.頁面全屏：H5全屏和F11實現效果一樣，根據瀏覽器可視區域與電腦屏幕大小做比較，但只能判斷無滾動的頁面。

  function isFullscreenForNoScroll(){
            var explorer = window.navigator.userAgent.toLowerCase();
            if(explorer.indexOf('chrome')>0){//webkit
                if (document.body.scrollHeight === window.screen.height && document.body.scrollWidth === window.screen.width) {
                    alert("全屏");
                } else {
                    alert("不全屏");
                }
            }else{//IE 9+  fireFox
                if (window.outerHeight === window.screen.height && window.outerWidth === window.screen.width) {
                    alert("全屏");
                } else {
                    alert("不全屏");
                }
            }
        }