![](/img/trans.png)
[英]How to show overlay on Plyr (html5 video player) when in Fullscreen?
[英]How to code a HTML5 fullscreen video player with multiple videos in loop?
我想編寫一個沒有任何控件的 HTML5 視頻播放器。 只需從目錄“我的網站/媒體”全屏自動播放和循環多個視頻。
包括“自動播放循環”和一些使視頻全屏顯示的 CSS 標簽對我來說工作正常,但我不能播放多個視頻。
是否可以在不使用任何控件或可見播放列表的情況下添加更多視頻? 只是在循環中自動播放我目錄中的所有視頻?
<div class="fullscreen-video-wrap">
<video src="media/firstvideo.mp4" autoplay loop></video>
</div>
您可以在元素上偵聽“結束”事件。 在第一個視頻結束后,您可以執行類似操作以將 src 替換為新視頻。
// listener function changes src
function myNewSrc() {
var myVideo = document.getElementsByTagName('video')[0];
myVideo.src = "http://mysite/myMovie2.m4v";
myVideo.load();
myVideo.play();
}
// add a listener function to the ended event
function myAddListener(){
var myVideo = document.getElementsByTagName('video')[0];
myVideo.addEventListener('ended', myNewSrc, false);
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.