<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<video id="myVid" width="100%" controls autoplay>
<source type="video/mp4" src="http://html5demos.com/assets/dizzy.mp4">
</video>
body {
background:#e1e1e1;
height:1000px;
}
video {
display:block;
width:100%;
margin:0 auto;
}
var myvid = $('#myVid')[0];
$(window).scroll(function(){
var scroll = $(this).scrollTop();
scroll > 70 ? myvid.pause() : myvid.play()
})
