任何人都可以帮忙解决这个问题吗?建议我像下面一样设置我的文件,以便单击图像会触发未显示的 HTML5 全屏视频,但我收到函数错误。我需要包含一些库吗?它似乎无法识别命令requestFullscreen
。
<body>
<div class="slide" id="">
<img src="../root/img/gc_small.png" id="videoPlay" style="margin:200px 0 0 0;">
</div>
<video autoplay loop muted controls="false" id="myVideo" style="width:800px;">
<source src="video/portal.mp4" type="video/mp4">
</video>
</body>
JS
<script type="text/javascript">
$(function() {
$('#videoPlay').on('click', function(event) {
event.preventDefault();
$('#myVideo').requestFullscreen();
});
});
</script>
最佳答案
这是我最近在我的项目中使用的东西
$(document).ready(function () {
var myVideo = $("video", _self)[0];
openFullscreen(myVideo)
})
function openFullscreen(myVideo) {
console.log("hitting")
var elem = myVideo
console.log(elem)
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.mozRequestFullScreen) { /* Firefox */
elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) { /* Chrome, Safari & Opera */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE/Edge */
elem.msRequestFullscreen();
}
}
关于jquery - HTML5 视频全屏 onclick,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27427023/