滚动到底部时加载新页面

Question

我正在为朋友建立一个网站。我边做边学。我已经制作了一个登陆页面，当用户滚动页面时可以播放动画。当用户滚动浏览整个动画时，我想加载主页。

我已经尝试过这种方式（How to load a new page/url when user reach the bottom），但是没有用。

 <div id="set-height"></div>

    <video id="v0" tabindex="0", autobuffer preload>
        <source type='video/mp4;codecs="avc1.42E01E, mp4a.40.2"' src="CircleShortKopie.mp4"></source>
    </video>


    <script>
var frameNumber = 0, // start video at frame 0
  // lower numbers = faster playback
  playbackConst = 1000,

  // get page height from video duration
  setHeight = document.getElementById("set-height"),
  // select video element         
  vid = document.getElementById('v0');

// var vid = $('#v0')[0]; // jquery option
// dynamically set the page height according to video length
vid.addEventListener('loadedmetadata', function() {
  setHeight.style.height = Math.floor(vid.duration) * playbackConst + "px";
});
// Use requestAnimationFrame for smooth playback
function scrollPlay() {
  var frameNumber = window.pageYOffset / playbackConst;
  vid.currentTime = frameNumber;
  window.requestAnimationFrame(scrollPlay);
}
window.requestAnimationFrame(scrollPlay);
    </script>
</body>
</html>

滚动动画后如何加载下一页？