Pausar vídeo ao scrollar

by Abner Rodrigues

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<video id="myVid" width="100%" muted controls autoplay>
  <source type="video/mp4" src="http://html5demos.com/assets/dizzy.mp4">
</video>

CSS

body {
  background: #e1e1e1;
  height: 1000px;
}

video {
  display: block;
  width: 300px;
  margin: 0 auto;
}

JavaScript

const video = $('#myVid')[0];
$(window).scroll(function() {
  const scroll = $(this).scrollTop();
  const offsetElemVideo = 70;
  
  if(scroll > offsetElemVideo){
     video.pause();
	 video.currentTime = 0;
	 video.load();
  } else {
  	 video.play();
  }
})