3

我有一个 iframe。在这个 iframe 里面我有一个播放器，它可以进入全屏模式。在桌面浏览器上一切正常，但它不适用于平板电脑上的 chrome 或 iPhone 上的移动 safari，但它适用于平板电脑上的 mozilla firefox。是否可以让 iframe 在移动设备上的 chrome 和 safari 中全屏显示？

这是我如何设置 iframe：

<iframe src='http://www.bader-kuperman.de/v3/pics/j-ch103346black/img3d_000051.html' border='0' width='620' height='465' scrolling='no' marginheight='0' marginwidth='0' frameborder='0' style='float:left; margin-left:0px' allowfullscreen='true' webkitallowfullscreen='true' mozallowfullscreen='true'></iframe>

这是我通过 iframe 集成播放器的网站。

http://www.bader-kuperman.de/de/collection/497/91/just/ch1033/black2014-09-17-21-15-01_-detail

希望你能给我一些建议。

4

2 回答 2

5

要覆盖整个视口，您可以使用：

<iframe src="PAGE" style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;"> </iframe>

这将填充整个页面或您要填充的部分。

于 2015-04-23T00:08:28.047 回答
0

您可以尝试使用一些内联样式来重置边框并手动设置高度和宽度。

<iframe style = "display: block;border: none;height: 100vh; width: 100vw;"; src='http://www.bader-kuperman.de/v3/pics/j-ch103346black/img3d_000051.html' border='0' width='620' height='465' scrolling='no' marginheight='0' marginwidth='0' frameborder='0' style='float:left; margin-left:0px' allowfullscreen='true' webkitallowfullscreen='true' mozallowfullscreen='true'></iframe>

JSFiddle

http://jsfiddle.net/qegaezk6/69/

于 2015-04-23T00:08:39.370 回答