是否可以在一定数量的滚动像素上生成动画?

时间:2016-01-06 20:15:44

标签: javascript jquery css animation

我想做的是:

在用户向下滚动600像素(或向下20%)之后,在接下来的800个像素(或页面的下一个10%距离)上发生动画。文本将从右向左移动,因此从0到-200%。它应该开始600像素的动画,并结束1400像素的动画。这可能吗?

目前我想这样做:

$('.div1').css({
    'position' : 'fixed',
    'top' : '-32%',
    'display' : 'block',
    'width' : '100%'
}).addClass('locked');

到达顶部div一旦达到600px,强制它不移动,而下一个div将动画。如何在文本动画制作并可能覆盖内容时阻止页面的其余部分向上滚动?

1 个答案:

答案 0 :(得分:0)

Skrollr这样做。

检查出来。

https://github.com/Prinzhorn/skrollr