Question

我想全屏播放视频。我使用iframe标签在弹出窗口中播放视频。

但它不是全屏播放。它从各个方面填充填充物。我如何全屏播放视频？

我使用此代码全屏显示，但无效。

<iframe id="popup_video" width="600" height="300" src="videopath" frameborder="0" allowfullscreen webkitAllowFullScreen mozAllowfullscreen></iframe>

输出：

Answer 1

将这些属性添加到iframe：<iframe … allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true">（不支持IE支持）

Answer 2

<html>
<head>
<title>
video
</title>
<style>
.iframe-container {
  position: relative;
  padding-bottom: 56.25%; /* 16x9 */
  height: 0;
  overflow: hidden;
  max-width: 100%;
  height: auto;
}
.iframe-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
</style>
</head>
<body>

<div class='iframe-container'>
  <iframe src='videopath' frameborder='0' allowfullscreen></iframe>
</div>
</body>
</html>

视频无法在iframe标签中全屏播放

2 个答案: