Menu
I have the following HTML:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<video id="video1" preload="metadata" width="1024" height="576" loop="false">
<source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
</video>
<script>
var video = document.getElementById('video1');
video.addEventListener("ended", function() {
alert('Ended');
});
video.play();
</script>
</body>
</html>
In chrome and firefox the video loops endlessly. Attaching listeners to the pause or ended events show these never actually get fired.
I need to know when a video has ended (and I need it to stop on ending). What am I doing wrong?
314
Apparently loop='false' still causes it to loop, and you have to completely remove the loop attribute to prevent looping. Ended never gets called if the video is set to loop.
144
video.addEventListener("ended",function(){
console.log("the video is end");
},false);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
