Javascript HTML5视频：自动播放在lightbox中不工作
我使用html5视频标签在灯箱中显示视频。视频本身运行良好。但当我试图自动播放时，当有人打开灯箱时，我失败了。 下面是我正在使用的javascript代码 HTML来触发工作正常的lightbox。Javascript HTML5视频：自动播放在lightbox中不工作,javascript,jquery,html,html5-video,lightbox,Javascript,Jquery,Html,Html5 Video,Lightbox,我使用html5视频标签在灯箱中显示视频。视频本身运行良好。但当我试图自动播放时，当有人打开灯箱时，我失败了。 下面是我正在使用的javascript代码 HTML来触发工作正常的lightbox。 <a href="#" class="btn btn-blue lightbox btnlb">Watch the full video</a> <video id="lbvideo" width="960" height="540"> <
<a href="#" class="btn btn-blue lightbox btnlb">Watch the full video</a>
<video id="lbvideo" width="960" height="540">
<source src="<?php bloginfo('template_directory'); ?>/videos/pinkgirl.mp4" type="video/mp4">
<source src="<?php bloginfo('template_directory'); ?>/videos/pinkgirl.ogg" type="video/ogg">
Your browser does not support HTML5 video.
</video>
$(".btnlb").click(function(e){
var myVideo = document.getElementById("lbvideo");
myVideo.play();
});
$(".btnlb").click(function(e){
setTimeout(function() {
var myVideo = document.getElementById("lbvideo");
myVideo.play();
console.log(myVideo);
}, 5000);
});
在做了几个小时之后，我找到了一个可以在几分钟内完成所有工作的替代方案。我使用了“余辉”，这是一款超级容易集成的HTML5视频播放器。有了这个简单的设置，我完全准备好了，它看起来真的很好
<!DOCTYPE html>
<html>
<head>
<title>afterglow player</title>
<script src="//cdn.jsdelivr.net/npm/afterglowplayer@1.x"></script>
</head>
<body>
<a class="afterglow" href="#myvideo">Launch lightbox</a>
<video id="myvideo" width="960" height="540">
<source type="video/mp4" src="/path/to/myvideo.mp4" />
</video>
</body>
<html>
余辉播放器
快乐编码：） 在做了几个小时之后，我找到了一个可以在几分钟内完成所有工作的替代方案。我使用了“余辉”，这是一款超级容易集成的HTML5视频播放器。有了这个简单的设置，我完全准备好了，它看起来真的很好
<!DOCTYPE html>
<html>
<head>
<title>afterglow player</title>
<script src="//cdn.jsdelivr.net/npm/afterglowplayer@1.x"></script>
</head>
<body>
<a class="afterglow" href="#myvideo">Launch lightbox</a>
<video id="myvideo" width="960" height="540">
<source type="video/mp4" src="/path/to/myvideo.mp4" />
</video>
</body>
<html>
余辉播放器