基于滚动的动画:如何创建它们

Scroll-based animations: how to create them

我看到了这个网页:http://www.wsj.com/ad/cocainenomics

它准确地展示了我想学习创建的动画类型。

没有什么非常复杂的东西,只是在用户滚动页面时出现的元素或层(不要考虑英雄视觉上的 'powder' 动画)。

哪种技术/编程语言/js-based library您认为专家动画师的建议是实现此目标的最佳选择?

我正在考虑:

你们认为哪种方法更可取?或者您还有其他想法?

你觉得velocity.js的强大与这么简单的动画不相称吗?我看过速度演示,它们比上述网站包含的 scroll-based 动画复杂得多。

请检查这个,https://codyhouse.co/gem/vertical-timeline/ i believe its exactly what you are looking for, check the demo here : https://codyhouse.co/demo/vertical-timeline/index.html 我相信这是一个非常简单的选择,因为它是免费的并且可以完全自定义。 (也几乎只有 css 和一点点 jquery)

我以前在 Skrollr 上发现过这种事情的成功:

编辑:我刚刚查看了 Skrollr 文档,发现它大约在一年前就停止维护了。快速 Google 提出了 ScrollMagic 作为可能的替代方案。我还建议深入研究您提供的示例站点的源代码,看看您是否可以深入了解他们使用的内容!

Velocity.js 不一定是您专门针对您正在寻找的那种基于滚动位置的动画而去的东西 - 它只是一个替代选项,用于执行与您相同的操作使用 jQuery 的 animate(),但使用幕后魔法使动画更高效。

严格来说,Whosebug 可能不是解决此类问题的最佳场所(请参阅 https://whosebug.com/help/dont-ask 上的问题指南)- 因此您的问题可能会被版主标记!