你看过凯蒂·佩里的网站吗？太棒了（我是认真的，没有垃圾邮件）！
它有一个移动的背景视频，我不明白他们是如何实现的。
这是主页：
http://www.katypeerry.com/ http://www.katyperry.com/
当您开始向下滚动时，背景图像（实际上是视频）开始播放。
我设法弄清楚这就是视频本身，
http://www.katypeerry.com/wp-content/themes/katyperri-2/library/video/KATY_BG_21.mp4 http://www.katyperry.com/wp-content/themes/katyperry-2/library/video/KATY_BG_21.mp4
垂直滚动会移动视频滑块。
我似乎不明白他们是如何做到这一点的，这让我发疯（花了很多时间试图对其进行逆向工程）
有任何想法吗？你以前做过/见过类似的事情吗？
提前致谢，
兹索尔特
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(); }
});
当页面滚动时，currentTime增加/减少有效地擦洗视频。
进一步阅读：LINK https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_HTML5_audio_and_video#Seeking_through_media
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
