0

I would like to show a video as soon as someone goes to my website, and at the end of it I would like it to disappear, to be able to display only the logo of my company.

I tried with a simple video tag, like this

  <video width="320" height="240" id="myVideo" autoplay>
   <source src="movie.mp4" type="video/mp4">
   <source src="movie.ogg" type="video/ogg">
   Your browser does not support the video tag.
 </video>

<script type='text/javascript'>
var vid = document.getElementById("myVideo");
vid.onended = function() {
  alert("The video has ended");
};
</script>

But this does only work if the video is muted and in my case it can not be. So I tried with the iframe tag, like this

<iframe id="myVideo" width="1280" height="720" src="https://www.youtube.com/embed/hMPMyMwg9Bc?autoplay=1" allow="autoplay" allowfullscreen></iframe>

This will let me autoplay the video with sound, but it does not allow me to catch the end point of the video

Niccolò Simoni
  • 95
  • 1
  • 2
  • 8
  • Does this answer your question? [Executing function at end of html5 video](https://stackoverflow.com/questions/14517639/executing-function-at-end-of-html5-video) – Ankit Beniwal May 15 '20 at 09:50
  • Nope, that just explains how to catch the end point of a video, but it does not explain how to make it start in autoplay and with sound – Niccolò Simoni May 16 '20 at 09:06

1 Answers1

1

The audio is working for me with the video tag.

You can simply remove the element after it has finished playing.

<script type='text/javascript'>
   var vid = document.getElementById("myVideo");
   vid.onended = function() {
   vid.remove()
};
roygbiv
  • 339
  • 3
  • 18