Autoplay another video when the original is finished

0

How can I do that when I finish playing the video completely another one is executed in autoplay mode. Something like in YouTube when you finish a video and leave you a few seconds until they execute another automatically.

<video autoplay muted preload="none"
src="vid/video001.mp4"
style=" position:absolute; width: 100vw;
-webkit-mask-image:-webkit-gradient(linear, left top, left bottom, 
from(rgba(0,0,0,0.3)), to(rgba(0,0,0,0)))">
</video>

When I finish the video001 I want to run the "video002" with the same gradient and in autoplay ... Thanks in advance!

    
asked by Danilo 11.06.2018 в 01:06
source

1 answer

1

Have you tried javascript through an Ended Event? with the setAttribute method you can change the src artributo and change the video to the one you want, without changing the other attributes. I leave you a similar template, sorry if I do not understand, I'm still an apprentice.

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Video</title>
	<script type="text/javascript">
		
		function iniciar() {
		 video=document.getElementById('video');
		 video.addEventListener('ended',reproducir,false);
	    }

		function reproducir() {
         video.setAttribute('src', 'musica2.mp4');
		}
		window.addEventListener('load',iniciar,false);
	</script>
</head>
<body>
	<section>
		<video id="video" autoplay muted
        controls src="musica.mp4">
        </video>
	</section>
</body>
</html>
    
answered by 11.06.2018 в 12:41