为什么全屏脚本不显示我的div

Question

我有一个带有一些Div的网页，还有一个img 当我点击图片时，我会触发一个将网站全屏放置的javascript。

这样可行，但它只显示图像（img）而不显示div

    function toggleFullScreen(elem) {
    if ((document.fullScreenElement !== undefined && document.fullScreenElement === null) || (document.msFullscreenElement !== undefined && document.msFullscreenElement === null) || (document.mozFullScreen !== undefined && !document.mozFullScreen) || (document.webkitIsFullScreen !== undefined && !document.webkitIsFullScreen)) {
        if (elem.requestFullScreen) {
            elem.requestFullScreen();
        } else if (elem.mozRequestFullScreen) {
            elem.mozRequestFullScreen();
        } else if (elem.webkitRequestFullScreen) {
            elem.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
        } else if (elem.msRequestFullscreen) {
            elem.msRequestFullscreen();
        }
    } else {
        if (document.cancelFullScreen) {
            document.cancelFullScreen();
        } else if (document.mozCancelFullScreen) {
            document.mozCancelFullScreen();
        } else if (document.webkitCancelFullScreen) {
            document.webkitCancelFullScreen();
        } else if (document.msExitFullscreen) {
            document.msExitFullscreen();
        }
    }
    }

 
    var auto_refresh = setInterval(
    function ()
    {
    $('#detail').load('loader.php');
    }, 1000 ); //60000

       body {
        text-align: center;
      }
      
     
          
      p {
        display: block;
        width: 450px;
        margin: 2em auto;
        text-align: left;
      }
.scorebord {
	content: "";
    display: block;
    position: absolute;
    width: 1120px;
    height: 750px; 
    border-radius: 10px;
    background-color: rgba(0,0,0,0.1); 
    box-shadow: 
             inset 0 -15px 30px rgba(0,0,0,0.4),
             0 5px 10px rgba(0,0,0,0.5);
    -moz-transform: translate(-15px, -285px);
    -webkit-transform: translate(-15px, -285px);
    -o-transform: translate(-15px, -285px);
    -ms-transform: translate(-15px, -285px);
    transform: translate(-15px, -285px);
 	top: 480px;
	left: 520px;
	font-family:"Arial";
	font-size:25px;

    }      

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="space"><br></div>
    <div id="container">
    <div id="wb_Image1" style="position:absolute;left:27px;top:14px;width:200px;height:147px;z- index:0;">
    <img src="images/logo2015trkl.png" id="Image1" alt=""  onclick="toggleFullScreen(document.body)"></div>
    </div>
    <div id="detail" class="scorebord"></div>

所以，如果你看一下代码可能会出现什么问题？

Answer 1

您正在将document.html传递给function toggleFullScreen(elem)。

document.html未定义。请尝试传递document.body。