[英]Skrollr: pass a function when the scroll position is after the last keyframe
Skrollr is an awesome plugin, plenty of options, but I can't really understand if there's some method for passing a function when the scroll position is after the last keyframe. Skrollr是一个很棒的插件,有很多选项,但是我真的不明白当滚动位置在最后一个关键帧之后时是否有某种方法可以传递函数。 For example, take a look at this fiddle .
例如,看看这个小提琴 。
When you scroll the top 100 pixels, the scrollable-between
class changes in scrollable-after
. 当您滚动顶部的100个像素时,
scrollable-between
类将在scrollable-after
更改。 In a similar way I'd like to pass a function (ex: when the scroll position is after the last keyframe do stuff). 我想以类似的方式传递一个函数(例如:当滚动位置在最后一个关键帧之后进行填充时)。
How would you achieve that? 您将如何实现?
You'll want to use the render
option. 您将要使用
render
选项。 Something like the following: 类似于以下内容:
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;
}
}
});
You don't necessarily have to have the boxDone
variable, but it keeps it from running multiple times when that happens. 您不一定必须具有
boxDone
变量,但是在发生这种情况时,它可以防止它多次运行。 You could also make it only happen once by not reseting that variable. 您也可以通过不重置该变量来使其仅发生一次。
I should probably also mention that you'll want make sure that whatever you do in there should run really fast or you run the risk of slowing down how smoothly everything moves. 我可能还应该提到,您将要确保在那里做的所有事情都应该运行得非常快,否则您就有可能放慢一切移动的速度。 You might be able to get around that by using
setTimeout
, but I haven't done any testing with that. 您也许可以使用
setTimeout
来解决此问题,但是我还没有对此进行任何测试。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.