iframe不會全屏

Question

正如標題所說，我無法設置一個完整的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/

Answer 1

您可以添加到您的第一個div元素：

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

設置div的高度和寬度100 ％視口高度/視口寬度

由於您已將iframe設置爲高度和寬度均爲100％，因此它將繼承其包含元素的大小，因此將該div的高度和寬度設置爲視口高度和視口寬度，iframe將會在寬度和高度上填充該空間的100％。

更新小提琴這裏：https://jsfiddle.net/john_h/579sxg8s/2/