如何在页面滚动上为图像设置动画?

时间:2014-01-30 11:48:38

标签: javascript jquery html5 css3 css-animations

我有一个页面,我的图像很少。我想知道当用户向下滚动页面并且图像变得可见时如何为图像设置动画?请查看此页面:http://www.elegantthemes.com/demo/?theme=Divi

向下滚动时,每个图像都会动画 - (掉落,滑入)+淡化。这个效果是什么以及如何实现?是否可以使用纯CSS3或JS来完成?

感谢。

2 个答案:

答案 0 :(得分:1)

我发现Skrollr.js是滚动动画的最佳工具。

查看我们的这两个教程,开始使用Skrollr:

[编辑]或者你可以使用scrollReveal.js,它按照它所说的做 - 在向下滚动页面时显示元素。

答案 1 :(得分:0)

基本上,这里需要使用Javascript以跟随用户向下滚动,并在他到达特定位置时进行动画制作。

我强烈推荐使用GreenSock动画: http://www.greensock.com/get-started-js/

您可以在此处详细了解: http://codeaway.info/parallax-and-scrolling-control-of-tweens-with-greensock-ap-js/

祝你好运。