Skrollr:当滚动位置在最后一个关键帧之后时传递函数

Skrollr: pass a function when the scroll position is after the last keyframe

本文关键字:关键帧 之后 传递函数 最后一个 滚动 位置 Skrollr      更新时间:2024-02-05

Skrollr 是一个很棒的插件,有很多选择,但我真的无法理解当滚动位置在最后一个关键帧之后时是否有某种传递函数的方法。例如,看看这个小提琴。

滚动前 100 个像素时,scrollable-between类会更改scrollable-after。以类似的方式,我想传递一个函数(例如:当滚动位置在最后一个关键帧之后时做一些事情(。

您将如何实现这一目标?

您需要

使用render选项。如下所示:

var box = $('#box'),
    boxDone = false;
skrollr.init({
    forceHeight: false,
    smoothScrolling: false,
    render: function() {
        if ( box.hasClass('skrollable-after') ) {
            if ( ! boxDone ) {
                boxDone = true;
               // do stuff
            }
        } else if ( boxDone ) {
            boxDone = false;
        }
    }
});

您不一定必须拥有 boxDone 变量,但它可以防止它在发生这种情况时多次运行。您也可以通过不重置该变量来使其仅发生一次。

小提琴

我可能还应该提到,你会希望确保你在那里做的任何事情都应该运行得非常快,否则你就有可能减慢一切移动的平稳程度。您可以使用setTimeout来解决这个问题,但我还没有对此进行任何测试。