這裏是我的代碼打在使用HTML5視頻標籤的背景視頻:何添加控件到html5視頻? (如何在後臺HTML命令視頻)
<video autoplay poster="polina.jpg" id="bgvid">
<source src="polina.webm" type="video/webm">
<source src="det/img/bgv.mp4" type="video/mp4">
</video>
但我怎麼添加控件? (播放視頻播放,暫停,停止)
這裏是我的代碼打在使用HTML5視頻標籤的背景視頻:何添加控件到html5視頻? (如何在後臺HTML命令視頻)
<video autoplay poster="polina.jpg" id="bgvid">
<source src="polina.webm" type="video/webm">
<source src="det/img/bgv.mp4" type="video/mp4">
</video>
但我怎麼添加控件? (播放視頻播放,暫停,停止)
您可以用JavaScript實現這一
從MSDN基本例如:
<script type="text/javascript">
function vidplay() {
var video = document.getElementById("Video1");
var button = document.getElementById("play");
if (video.paused) {
video.play();
button.textContent = "||";
} else {
video.pause();
button.textContent = ">";
}
}
function restart() {
var video = document.getElementById("Video1");
video.currentTime = 0;
}
function skip(value) {
var video = document.getElementById("Video1");
video.currentTime += value;
}
</script>
</head>
<body>
<video id="Video1" >
// Replace these with your own video files.
<source src="demo.mp4" type="video/mp4" />
<source src="demo.ogv" type="video/ogg" />
HTML5 Video is required for this example.
<a href="demo.mp4">Download the video</a> file.
</video>
<div id="buttonbar">
<button id="restart" onclick="restart();">[]</button>
<button id="rew" onclick="skip(-10)"><<</button>
<button id="play" onclick="vidplay()">></button>
<button id="fastFwd" onclick="skip(10)">>></button>
</div>
您可以添加屬性 「控制」 的標籤
<video autoplay poster="polina.jpg" id="bgvid" controls>...</video>
你可以使用JavaScript來鉤入視頻對象。將其綁定到按鈕單擊或任何其他類型的適用於您的應用程序的事件。
var v = document.getElementsByTagName("video")[0];
v.play();
如果適用它可能是考慮尋找到使用JavaScript庫的設計使用視頻標籤更容易做出有益的。
進行更多的研究:
Mozilla::Using_HTML5_audio_and_video
Microsoft::Using JavaScript to control the HTML5 video player