如何根据页面滚动同时执行动画?

jianglou417
  • 5
新手上路,请多包涵

image

如图,随着手指滑动,动画同时进行,而且可以回滚,这样的动画要怎么做?

回复
阅读 3k
3 个回答
✓ 已被采纳

额,很明显这是一个‘一镜到底’的timeline动画。你可以将当前滚动距离转换为整个动画的进度。结合tweenmax的timeline动画。例如,你的场景是10个屏幕,整个滚动距离是10screenHeight,整个时间动画从0-》1。那么当前的进度就是scrollTop/10screenHeight。然后回滚当然也是动画的一部分。

你可以使用这个canvas框架 http://tinyjs.net/ 我们使用过,感觉不错

具体的实现思路,你可以搜索一镜到底,随便找了个https://segmentfault.com/a/11...

水不凉
  • 4.8k
宣传栏