如何在Iframe中允许全屏模型

Question

我使用这个js创建一个iframe：

parent.html

<script type="text/javascript">
var ifrm = document.createElement("iframe");
ifrm.setAttribute("src", "demo.html");
ifrm.setAttribute("id", "retNotif;");
ifrm.style.width = "540px";
ifrm.style.height = "200px";
ifrm.style.minHeight = "100px";
ifrm.style.position = "fixed";
ifrm.style.bottom = "150px";
ifrm.style.left = "0px";
ifrm.style.backgroundColor = "transparent";
ifrm.style.zIndex = "9999";
ifrm.frameBorder = "0";
ifrm.allowTransparency = "true";
document.body.appendChild(ifrm);
</script>

iframe中的

（demo.html）：我有一个正常的bootstrap模型

我想在iframe全屏内显示模型怎么做？

Answer 1

<script type="text/javascript">
  window.onload=function(){
    var ifrm = document.createElement("iframe");
    ifrm.setAttribute("src", "demo.html");
    ifrm.setAttribute("id", "retNotif;");
    ifrm.style.width = "100vw";
    ifrm.style.height = "100vh";
    ifrm.style.minHeight = "100px";
    ifrm.style.position = "fixed";
    ifrm.style.top = "0";
    ifrm.style.left = "0";
    ifrm.style.backgroundColor = "transparent";
    ifrm.style.zIndex = "9999";
    ifrm.frameBorder = "0";
    ifrm.allowTransparency = "true";
    document.body.appendChild(ifrm);
  }
</script>

左上角的固定iframe，宽度和高度均为100％。