<video id="vid" src="https://assets.codepen.io/3/lil-video.webm"></video>
body {
  padding-top: 2000px;
}
View Compiled
let observer = new IntersectionObserver((entries, observer) => {
  entries.forEach((entry) => {
    if (window.matchMedia("(prefers-reduced-motion: reduce)").matches) {
      // go to some good part of video
      vid.currentTime = 1.2;
    } else {
      if (entry.isIntersecting) {
        vid.play();
      }
    }
  });
});

observer.observe(vid);

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.