我成功地使用HTML 5视频标记和jQuery以全屏模式打开视频以响应事件(click,keypress)。如何在页面加载时以全屏模式打开视频而不是onclick?任何帮助,将不胜感激。非常感谢!
我的HTML:
<div id="video_container>
<video id="video1" width="1280" height="720" controls autoplay>
<source src="videos/ballet.mp4" type="video/mp4">
<source src="videos/ballet.webm" type="video/webm">
<source src="videos/ballet.ogv" type="video/ogg">
</video>
</div>
我的JavaScript:
$(document).ready(function(){
$('#video1').bind("playing", function(){
var elem = document.getElementById("video1");
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.mozRequestFullScreen) {
elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) {
elem.webkitRequestFullscreen();
}
});
$('#video1').bind("ended", function(){
$("#video_container").hide();
});
});
答案 0 :(得分:4)
听起来你无法在页面加载时全屏显示视频,至少对于webkit浏览器而言。根据Safari开发者库:
只有在响应时才能调用webkitEnterFullscreen()方法 用户操作,例如单击按钮。你无法调用 webkitEnterFullscreen()以响应加载事件,例如。