视差效果:滚动时使前景移动

Question

我有一些图像,我想垂直放在一个页面上作为一个信息图形.但是,我想将背景与前景元素分开,并且有一点视差效果,当你向下滚动时,前景(背景)元素移动......

不知道用jQuery甚至CSS3如何最好地完成这个...任何链接或示例都将是最受欢迎的.

Answer 1

你可以使用jquery.parallax.

jParallax将节点转换为绝对定位的层,以响应鼠标移动.根据它们的尺寸,这些层以不同的速率移动,采用平行的方式.

屏幕截图如何:

jQParallax http://stephband.info/jparallax/images/diagram.png

该代码也小.

<ul>
    <li class="parallax-layer"></li>
    <li class="parallax-layer"></li>
</ul>