Stellar JS /触发函数在一定高度

Question

我正在使用stellar.js JS (http://markdalgleish.com/projects/stellar.js/)为Ipad构建一个视差滚动站点，我想在某个高度触发一个函数(从屏幕右侧开始播放幻灯片)--有没有人有过监控屏幕高度和触发函数的经验--无论是使用stellar.js还是一般情况下都是如此。

干杯保罗

Answer 1

当你滚动到某个高度时触发一个函数是非常可行的，只需使用一点jQuery --下面是一些简单的代码：

function scrollHeightTrigger (height, fn) {
  var old_height = $(document).scrollTop();
  $(document).scroll(function () {
    var new_height = $(document).scrollTop();
    if (((height < new_height) && (height >= old_height)) ||
        ((height < old_height) && (height >= new_height))) {
      fn();
    }
    old_height = new_height;
  });
}

scrollHeightTrigger接受一个高度和一个函数-- height指定函数在距顶部多远的滚动距离处被触发。这是通过记住文档顶部之前的高度来完成的，然后在每次用户滚动时检查他们是否超过了目标。如果有，函数就会被触发。

按原样，这将在每次传递滚动位置时重复该函数-如果您想要一次执行，那么修改它应该不会太难。