Well, well, well, that is quite an intriguing inquiry.
In terms of the parallax effect, I believe it goes by the name of a "sticky" background.
And as for the method used to achieve this, it appears to be something along these lines...
<div class="video-bg-spacer">
//A blank div with a see-through background acting as a "view window" for the video
</div>
//Towards the end of your code...
<div class="video-container">
<video class="background-video" autoplay="autoplay" loop="loop" muted="muted">
<source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4"/>
<source src="http://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg"/>
</video>
</div>
The styling for the background video will look something like this:
.background-video {
height: 100%;
margin: 0 auto;
position: fixed;
z-index: -100;//beneath everything else
background-attachment: fixed;
top: 0;
left: 0;
}
.video-bg-spacer {
background: transparent;
height: 100vh;
}
Take a gander at this example.
https://codepen.io/jacob_124/pen/QvRLXG?editors=0100
I have thoroughly examined the code from the demonstrated instance and indeed, this is how they pull it off...
Placing your video content at the bottom ensures that all images on your page load before the video itself.