JSFiddle - React, Tailwind, and code Playground

by rga4

HTML

<div width="100%" >
<p>
TEST
</p>
<video id="video1" style="width: 300px; display: block; margin-left: auto;
    margin-right: auto;" width="500" loop="loop" autoplay="autoplay" muted><source src="https://phdcare.com.ua/wp-content/uploads/molecule720.mp4" type='video/mp4'></video>

</div>

<br>
вывод нескольких изображений:
<br>
<video id="video1" width="500" muted>
<source src="https://phdcare.com.ua/wp-content/uploads/molecule720.mp4" type="video/webm">
</video>
<video id="video2" muted style="width: 500px; height: 400px; object-fit: fill;">
<source src="https://phdcare.com.ua/wp-content/uploads/molecule720.mp4" type="video/webm">
</video>
<video id="video3" muted style="width: 500px; height: 500px; object-fit: fill;">
<source src="https://phdcare.com.ua/wp-content/uploads/molecule720.mp4" type="video/webm">
</video>
<video id="video4" muted style="width: 500px; height: 400px; object-fit: fill;">
<source src="https://phdcare.com.ua/wp-content/uploads/molecule720.mp4" type="video/webm">
</video>
<video id="video5" muted style="width: 500px; height: 500px; object-fit: fill;">
<source src="https://phdcare.com.ua/wp-content/uploads/molecule720.mp4" type="video/webm">
</video>

<script>
var vid = document.getElementById("video1"); vid.currentTime = 1*1.000/25-0.01; 
var vid = document.getElementById("video2"); vid.currentTime = 2*1.000/25-0.01;
var vid = document.getElementById("video3"); vid.currentTime = 3*1.000/25-0.01;
var vid = document.getElementById("video4"); vid.currentTime = 4*1.000/25-0.01;
var vid = document.getElementById("video5"); vid.currentTime = 5*1.000/25-0.01;
</script>