Destroying the HTML video player?
Question
I want to play a video over an embedded game of mine and when the video ends, I want it to disappear so that we seamlessly go from the intro to the game itself (can't insert the video into the game in the engine I'm working in). How can I do this? Currently, I have something like this:
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class = "container"><span>
<iframe src='...' />
<video autoplay> <source src="intro.mp4" type="video/mp4">
</video>
</span></div>
<script>
var video = document.getElementsByTagName('video')[0];
video.onended = function(e) {
# Don't know what to put in here
};
</script>
</body></html>
1 answers
solution1
0 2015-06-25 15:49:42
One way you can do it is by giving the exact same size to the game's element and the video.
Then you could hide the game with the inline css display: none; when the page starts, and once the video ends you can hide the video and display the game.
var game = document.getElementById("...");
var video = document.getElementById("...");
game.style.display = "none";
video.onended = function(e) {
video.style.display = "none";
// or if you want to destroy it permanently
// video.parentNode.removeChild(video);
// video = null;
game.style.display = "";
};
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.