jQuery教学－简单好用的视差滚动特效Parallax Effect

若 各位有在注意Firefox OS的朋友，应该会发现到，在台湾的官网中，有一个相当特别的效果，当滚动画面时，感觉画面上叠了一层图层，可在某一个区块中，把背景固定住，然后内容不 断的更换，当这个单元介绍完后，再向下滚动卷轴时，下个单元的内容则会向上推，把上一个单元的内容给覆盖上去，是一个相当特别的视觉新感受，而这个酷炫的 特效也有专有名称，就叫作「视差滚动」特效，只需透过CSS、jQuery套件，就可快速的实现出此效果，而这种效果相当适合拿来介绍产品时使用，且这种 视差滚动特效的模组也相当多，梅干则挑选了一个较简单的，来为各位介绍一下啰！ 让你也可快速使用此特效。

视差滚动jQuery Parallax Effect：

Step1
将用到的js外挂放到head标签之间。

Step2
将要滚​​动的DIV区块，加到body标签之间。

Step3
设定css样式外，再分别设定div滚动区块的水平位置、速度。

Step4
这样就完成啰! 当预览时就会发现到，一种很特别的视觉效果，就像是在滚动图层一样。

[范例预览] | [Firefox OS视差滚动特效]

原文：http://www.minwt.com/js/9082.html