如何实现此背景滚动效果? [英] How can I achieve this background scroll effect?

查看:75
本文介绍了如何实现此背景滚动效果?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我非常喜欢每个背景部分相互重叠的方式,向下滚动。我已经看到它做了很多:
这里是链接: http://www.soleilnoir.net / believein /

I really like the way each background section overlaps each other which scrolling down. I have seen it done a lot: here is the link : http://www.soleilnoir.net/believein/

任何想法如何实现类似的效果?

Any ideas how to achieve the similar effect?

谢谢

推荐答案

此效果称为 parallax

以下是与此效果相关的一些链接:

Here are some links related to this effect:

  • a great demo from Nike http://www.nike.com/jumpman23/aj2012/
  • a collection of parallax http://webdesignledger.com/inspiration/21-examples-of-parallax-scrolling-in-web-design (make sure to see each example, some are really great ! ex: http://benthebodyguard.com/index.php http://www.siebennull.com/ http://janploch.de/)
  • Mercedez Class A web site http://a-class.mercedes-benz.com/com/en/index.html#!/?s=live (not really parallax but still great)
  • a tutorial on how to make an image slider using parallax effect http://tympanus.net/codrops/2011/01/03/parallax-slider/
  • another tutorial with different effects http://tympanus.net/codrops/2012/03/15/parallax-content-slider-with-css3-and-jquery/
  • a library to do parallax https://github.com/cameronmcefee/plax
  • another library https://github.com/markdalgleish/stellar.js

你可能也喜欢这个:

  • http://johnpolacek.github.com/scrollorama/
  • http://joelb.me/scrollpath/

这篇关于如何实现此背景滚动效果?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆