css after video upload?

Question

css

there is a video background on the page that automatically starts playing after loading

<video poster="/screenshot.jpg" id="video1" playsinline="playsinline" preload="auto" autoplay="true" muted="true" loop="loop" controls="controls">
          	<source src="video/fly.mp4" type="video/webm">
          	<source src="video/fly.mp4" type="video/mp4">
          	</video>

there is text "like motivational and stuff" in the divs that appears on the video.
in css, everything is written in time and the texts appear at the right time on the video.
the question is how now to make this css start working only after the video starts playing on the page.

Answer 1

window.onload = function() {
  setTimeout(function() {
    var video = document.getElementById('video1');
    video.play();
  }, 1000);
}

Perhaps this will help you.