HTML5视频嵌入在播放结束时返回海报 [英] HTML5 Video Embed Return to Poster at End of Play
问题描述
我正在使用Video.JS但最终不得不废弃它并使用纯HTML视频嵌入标记。有人可以帮助我使用JavaScript，当视频停止播放时，它会返回开始海报。我在Video.JS中使用它但找不到标准HTML的正确代码。
I was using Video.JS but ultimately had to scrap it and go with plain HTML video embed tag. Can someone help me with the JavaScript that will return the to start poster when the video stops playing. I had it working in Video.JS but can't find the right code for standard HTML.
这是当前代码，我清除了JavaScript，因为它不是无论如何工作。
Here's the current code and I cleared out the JavaScript since it wasn't working anyway.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<video id="testimonials" width="448" height="336" controls preload="auto" poster="https://dl.dropboxusercontent.com/u/236154657/video-splash-image4.png"
data-setup='{"example_option":true}'>
<source src="https://dl.dropboxusercontent.com/u/236154657/WK%20Life%20Coaching%20Video%2012.13.mp4" type='video/mp4'>
</video>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js">
</script>
</body>
</html>
推荐答案
我能找到的最简单方法是重置已结束事件的视频源，以便它返回到开头。处理它的另一种方法是在交换视频时使用海报图像的div，但这更简单......
The easiest way I have been able to find is to reset the source of the video on the ended event so that it returns to the beginning. The other way to handle it would be to have a div with the poster image in that you swap out for the video, but this is simpler...
<script>
var vid=document.getElementById('testimonials');
vid.addEventListener("ended", resetVideo, false);
function resetVideo() {
// resets the video element by resetting the source
this.src = this.src
}
</script>
这篇关于HTML5视频嵌入在播放结束时返回海报的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
