分享七款视差滚动效果的jQuery 插件

2014-03-14阅读(4553)评论(0)

W3Cways.com 微信公众号

视差(Parallax)是指从不同的点看一个物体时形成的视觉差异,这个名词是源自希腊文的παράλλαξις (parallaxis),意思是”改变”。在网页设计中,视差滚动(Parallax Scrolling)是当下流行的网页设计技术,通过让多层背景以不同的速度或者不同的方向移动来形成非常有趣的 3D 运动效果。
相信你非常想知道上面这些网页的精美视差滚动效果是如何实现的,今天这篇文章就和大家分享六款精心挑选的 jQuery 视差滚动效果插件,它们能够帮助你制作出精美的视差滚动效果。

Sequence.js

Sequence 是一款非常优秀的 jQuery 滑动插件,能实现多种精美的滑动效果,其中之一就是水平方向的视差滚动。
Sequence

Demo下载源代码

Parallax Slider with jQuery

Parallax Slider with jQuery

Demo下载源代码

jQuery Scroll Path

这款插件用于实现自定义路径的滚动效果。可以显示使用 Canvas 绘制路径线条和弧形,看到非常形象的运动效果。
jQuery Scroll Path

Demo下载源代码

jQuery Parallax

这款 jQuery 插件实现了类似 Nikebetterworld.com 产品展示页面的视差滚动效果,代码托管在 Github 上面。
jQuery Parallax

Demo下载源代码

Scrollorama

这款 jQuery 插件能够帮助你实现非常酷的滚动效果,可以应用飞入、缩放、淡入淡出等多种过渡效果。
Scrollorama

Demo下载源代码

Stellar.js

正如它的口号所说:实现视差滚动效果从未如此容易,的确,它能帮助轻松的实现网页视差滚动效果。
Stellar

Demo下载源代码

jParallax

这款基于 jQuery 的视差滚动插件使用简单,官方提供了五种不同的效果演示。
jParallax

Demo下载源代码

转载请注明来源:Web前端(W3Cways.com) - Web前端学习之路 » 分享七款视差滚动效果的jQuery 插件

分享到:更多 ()

Web前端开发-Web前端工程师--Web前端学习之路

联系我们