<!DOCTYPE html>
<html>
<head>
<title>Simple Video Example</title>
<!-- Uncomment the following tag when developing on a local or intranet computer -->
<!-- <meta http-equiv='X-UA-Compatible' content="IE=edge" /> -->
<script>
function hidecontrol(e) {
// Set controls to true or false based on their current state
var video = document.getElementById('video1');
if (video.controls == true) {
// Controls are binary, true if there, false if not
video.removeAttribute("controls");
e.innerHTML = "Show controls";
} else {
// Controls are binary, true if there, false if not
video.setAttribute("controls", true);
e.innerHTML = "Hide controls";
}
}
function playVideo(e) {
var video = document.getElementById('video1'); //video element
// Toggle between play and pause based on the paused property
if (video.paused) {
var input = document.getElementById('videoFile'); //text box
if (input.value) {
// Only load a video file when the text field changes
if (input.value != video.src) {
video.src = input.value;
}
video.play();
e.innerHTML = "Pause";
}
} else {
video.pause();
e.innerHTML = "Play";
}
}
</script>
</head>
<body>
<video id="video1" controls >HTML5 video is not supported</video><br />
<input type="text" id="videoFile" size="60" placeholder="Enter video file URL here"/>
<button οnclick="playVideo(this);">Play</button>
<button οnclick="hidecontrol(this);">Hide controls</button>
</body>
</html>
1228
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
