Moving video background as mouse scrolls
function updateVideo() { var video = $('#video-bg').get(0); var videoLength = video.duration; var scrollPosition = $(document).scrollTop(); video.currentTime = (scrollPosition / ($(document).height() - $(window).height())) * videoLength;//(scrollPosition / SCROLL_SCRUB_SPEED) % videoLength;}$(window).scroll(function(e) { if(videoReady && continueUpdatingVideo) { updateVideo(); } });
As the page is scrolled, currentTime
is increased / decreased effectively scrubbing through the video.
Further reading: LINK