Autoplay Video on scroll by checking if video is in viewport

autoplay.html

<video id="myVideo" src="video.mp4" muted></video>
<script>
  const video = document.getElementId("myVideo");
  
  function autoplayVideo() {
    const rect = video.getBoundingClientRect();
    if (rect.top >= 0 && rect.bottom <= window.innerHeight) {
      video.play();
    } else {
      video.pause();
    }
  }
  
  window.addElementListener("scroll", autoplayVideo);
  window.addElementListener("resize", autoplayVideo);
</script>