不使用任何 api 的自动全屏 iframe 视频
Auto full screen iframe video without using any api
是否可以制作"auto full screen a iframe video with out using any api"。我已经尝试过 youtube api 它的工作 well.but 我需要知道这是否可能或者 not.any 请用演示向我解释。谢谢。
或实现此解决方案的任何其他方法/技巧。
javascript 有一个解决方案。它适用于 Mozilla 和 Webkit 浏览器。
您可以使用 element.mozRequestFullScreen();
和 element.webkitRequestFullScreen();
示例:
function goFullscreen(id) {
var element = document.getElementById(id);
if (element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if (element.webkitRequestFullScreen) {
element.webkitRequestFullScreen();
}
}
<img class="video_player" src="image.jpg" id="player"></img>
<button onclick="goFullscreen('player'); return false">Fullscreen</button>
要允许 <iframe>
元素的全屏模式,您需要将 iframe 设置为 allowFullScreen
:
<iframe src="iframe.html" width="100" height="100" allowFullScreen></iframe>
您可以使用 Html5 功能,使用视频标签
<video width="321" height="244" controls>
<source src="folder/movie.mp4" type="video/mp4">
<source src="folder/movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
或者您可以使用 iframe。
<iframe src="folder/movie.mp4" width="550" height="380"
frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen>
</iframe>
是否可以制作"auto full screen a iframe video with out using any api"。我已经尝试过 youtube api 它的工作 well.but 我需要知道这是否可能或者 not.any 请用演示向我解释。谢谢。
或实现此解决方案的任何其他方法/技巧。
javascript 有一个解决方案。它适用于 Mozilla 和 Webkit 浏览器。
您可以使用 element.mozRequestFullScreen();
和 element.webkitRequestFullScreen();
示例:
function goFullscreen(id) {
var element = document.getElementById(id);
if (element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if (element.webkitRequestFullScreen) {
element.webkitRequestFullScreen();
}
}
<img class="video_player" src="image.jpg" id="player"></img>
<button onclick="goFullscreen('player'); return false">Fullscreen</button>
要允许 <iframe>
元素的全屏模式,您需要将 iframe 设置为 allowFullScreen
:
<iframe src="iframe.html" width="100" height="100" allowFullScreen></iframe>
您可以使用 Html5 功能,使用视频标签
<video width="321" height="244" controls>
<source src="folder/movie.mp4" type="video/mp4">
<source src="folder/movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
或者您可以使用 iframe。
<iframe src="folder/movie.mp4" width="550" height="380"
frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen>
</iframe>