0

Here is my HTML section..

<section id ="information">
  <video id ="videoName" width="800" height="400" controls 
   onplay="myAnimationPicture()"">
<source src="video/videoName.mp4" ; type="video/mp4">
 Your browser does not support the video tag.
 </video>
</section>

Here is my Javascript section... document.getElementById('videoName').addEventListener('ended',deleteVideo,false);

function deleteVideo(e) 
{
    var elem = document.getElementById('videoName');// What you 
    want to do after the event
    elem.remove();
}

Please let me know if it is even possible. What I eventually want to try and accomplish is after the user watches the video, the video is removed and is replaced with a horizontal menu for stats information.

Thank you,

Josh

  • Possible duplicate of [Detect when an HTML5 video finishes](https://stackoverflow.com/questions/2741493/detect-when-an-html5-video-finishes) – Olian04 Feb 26 '19 at 22:44
  • elem.onended = function() { // The audio has ended }; – Minan Feb 26 '19 at 22:44
  • So with everything suggested and offered to me, nothing is working to remove the video. Maybe it is browser specific but I may just move the menu bar below the video for now. – jgilmore07 Feb 28 '19 at 21:12

2 Answers2

0

You could do something like this:

document.getElementById('videoName').addEventListener('ended',myHandler,false);
function myHandler(e) {
    //remove video here
    //add menu here
}

Which attaches a callback function (myHandler) that gets triggered after the video is done.

Jesse Sliter
  • 233
  • 1
  • 4
  • 15
  • I have tried this but I think I'm not getting my "remove video" code correct. function myHandler(e) { e.target.parentNode(e.target); or e.deleteVideo.target(e.target); – jgilmore07 Feb 28 '19 at 23:02
  • Try e.target.remove() or e.target.parentNode.removeChild(e.target). You could always set the parent containers inner html to "" – Jesse Sliter Mar 01 '19 at 00:30
0

Get the parent event target and remove the child ('#videoName')

function deleteVideo(e) {
  e.target.parentNode.removeChild(e.target)
}