HTML video stops playing after 1 minute and 50 seconds-CodePudding

I have a video that is 2 minutes and 42 seconds in length. I have confirmed the video itself plays through and is not corrupted. The video plays fine up until the 1.50 mark and then abruptly stops.

<div >
     <video controls preload>
        <source style="width: 100%; height:50%" src="splitscreen.mp4" type="video/mp4" />
     </video>
</div>

.video-container {
    width: 100%;
    height: 100%;
    position: relative;
}

CodePudding user response：

You could try using Media Fragments and see if this allows the entire video to be played.

<source style="width: 100%; height:50%" src="splitscreen.mp4.webm#t=0:00:00,00:02:42" type="video/mp4" />

Adding a media fragment to the media URL, you can specify the exact portion you want to play. To add a media fragment, you add #t=[start_time][,end_time].

CodePudding user response：

First, confirm the video's length through JS:

 <video id="myVideo" controls preload="auto">
        <source style="width: 100%; height:50%" src="splitscreen.mp4" type="video/mp4" />
 </video>

<script>
    var vid = document.getElementById("myVideo");
    alert("Video duration is : "   vid.duration);
</script>

all I'm doing here is giving your video a ID, declaring a variable which holds document.getElementById("myVideo"), then checking it's length by using the .duration and alerting it. If you see your expected video's length:

I have a video that is 2 minutes and 42 seconds in length.

Then I believe "controls preload" is your error here as the syntax is incorrect (should be preload="auto"), check here for great explanation about it.

Of-course if the video's length does show 1:50 in the alert, then the video is corrupted. Best of luck!