Question

我希望能够通过iframe外部的按钮将iframe启动到全屏幕。我的按钮可以将页面启动到全屏，但我不确定，无法找到如何为iframe执行相同操作。

代码

HTML BUTTON：

<button onclick="launchFullscreen(document.documentElement);" class="sexyButton">Launch Fullscreen</button>

JS：

function launchFullscreen(element) {
  if(element.requestFullscreen) {
    element.requestFullscreen();
  } else if(element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
  } else if(element.webkitRequestFullscreen) {
    element.webkitRequestFullscreen();
  } else if(element.msRequestFullscreen) {
    element.msRequestFullscreen();
  }
}

Answer 1

为什么不在新标签页中创建链接到iframe源代码的链接？您也可以使用这篇文章，因为它有一些很好的例子。

这就是一起：

<script>
<!--
function fullwin(){
window.open("YOURURLHERE.COM","bfs","fullscreen,scrollbars")
}
//-->
</script>

<form>
<input type="button" onClick="fullwin()" value="Open Full Screen Window">
</form>

http://www.htmlgoodies.com/beyond/dhtml/article.php/3470521

基本的谷歌搜索提出了另一种方式：

Building an amazing fullscreen mobile experience

Answer 2

终于能够找到答案。

// Find the right method, call on correct element
function fullScreen(element) {
  if(element.requestFullscreen) {
    element.requestFullscreen();
  } else if(element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
  } else if(element.webkitRequestFullscreen) {
    element.webkitRequestFullscreen();
  } else if(element.msRequestFullscreen) {
    element.msRequestFullscreen();
  }
}

function fullwin(){
var canvas = document.getElementById('ppt');
fullScreen(canvas);
}

从外部iframe启动全屏

2 个答案: