iframe没有全屏显示

时间:2016-09-07 12:17:52

标签: html iframe fullscreen

正如标题所说,我无法设法获得完整的scren iframe。

以下是代码:

<div data-role="page" id="p'+item.id+'"><div data-role="header" style="background-color: #FFFFFF;border:none;" data-position="fixed"><a href="#" onClick="location.href=\'documenti.html\'" data-role="button" data-icon="back" data-iconpos="notext" class="ui-btn-left">Home</a><img src="images/app/logo.png" id="navImg"/></div><iframe src="https://docs.google.com/gview?embedded=true&url=http://' + item.path + '" width="100%" height="100%" align="center" ></iframe></div>

演示:https://jsfiddle.net/579sxg8s/

1 个答案:

答案 0 :(得分:1)

您可以将其添加到您的第一个div元素:

style="width: 100vw; height: 100vh;"

将div的高度和宽度设置为 viewportheight / viewportwidth

的100%

由于你已经将iframe设置为100%的高度和宽度,它将继承其包含元素的大小,因此将该div的高度和宽度设置为视口高度和视口宽度,iframe将在宽度和高度上填充100%的空间。

在这里更新了小提琴:https://jsfiddle.net/john_h/579sxg8s/2/