Jquery中文網 www.4271936.live
Jquery中文網 >  jQuery  >  jquery 教程  >  正文 六款幫助你實現驚艷視差滾動效果的jQuery插件

六款幫助你實現驚艷視差滾動效果的jQuery插件

發布時間:2013-09-23   編輯:www.4271936.live
視差(Parallax)是指從不同的點看一個物體時形成的視覺差異,這個名詞是源自希臘文的παράλλαξις (parallaxis),意思是改變
在網頁設計中,視差滾動(Parallax Scrolling)是當下流行的網頁設計技術,通過讓多層背景以不同的速度或者不同的方向移動來形成非常有趣的 3D 運動效果。下面是一些運用視差滾動效果的優秀網頁案例:

視差(Parallax)是指從不同的點看一個物體時形成的視覺差異,這個名詞是源自希臘文的παράλλαξις (parallaxis),意思是"改變"。在網頁設計中,視差滾動(Parallax Scrolling)是當下流行的網頁設計技術,通過讓多層背景以不同的速度或者不同的方向移動來形成非常有趣的 3D 運動效果。下面是一些運用視差滾動效果的優秀網頁案例:

  相信你非常想知道上面這些網頁的精美視差滾動效果是如何實現的,今天這篇文章就和大家分享六款精心挑選的 jquery 視差滾動效果插件,它們能夠幫助你制作出精美的視差滾動效果。

 

Sequence.js

Sequence 是一款非常優秀的 jQuery 滑動插件,能實現多種精美的滑動效果,其中之一就是水平方向的視差滾動。

 

 

在線演示  下載源碼

 

jQuery Scroll Path

這款插件用于實現自定義路徑的滾動效果??梢燥@示使用 Canvas 繪制路徑線條和弧形,看到非常形象的運動效果。

 

 

在線演示  下載源碼

 

Parallax Slider with jQuery

這個視差滾動滑動效果多次在我的博文中出現過,相信關注我博客的朋友一定不會陌生,有非常詳細的制作教程。

 

 

在線演示  下載源碼

 

jQuery Parallax

這款 jQuery 插件實現了類似 Nikebetterworld.com 產品展示頁面的視差滾動效果,代碼托管在 Github 上面。

 

 

在線演示  下載源碼

 

Scrollorama

這款 jQuery 插件能夠幫助你實現非??岬臐L動效果,可以應用飛入、縮放、淡入淡出等多種過渡效果。

 

 

在線演示  下載源碼

 

Stellar.js

正如它的口號所說:實現視差滾動效果從未如此容易,的確,它能幫助輕松的實現網頁視差滾動效果。

 

 

在線演示  下載源碼

 

jParallax

這款基于 jQuery 的視差滾動插件使用簡單,官方提供了五種不同的效果演示。

 

 

在線演示  下載源碼

您可能感興趣的文章:
六款幫助你實現驚艷視差滾動效果的jQuery插件
推薦40個簡單的 jQuery 導航插件和教程(下篇)
11個用于提高排版水平的基于jquery的文字效果插件
推薦40款強大的 jQuery 導航插件和教程(上篇)
非常有用的40款jQuery 插件推薦(系列二)
10款新鮮出爐的 jQuery 插件(Ajax 插件,有幻燈片、圖片畫廊、菜單等)
40款非常有用的 jQuery 插件推薦(系列一)
Jquery+CSS3實現一款簡潔大氣帶滑動效果的彈出層
jQuery圖片播放8款精美插件分享
Stellar.js

關鍵詞: 驚艷視差  滾動效果   
[關閉]
微信下载APP完成任务如何赚钱 股票融资技巧 湖北十一选五最大遗漏一定牛 北京pk赛车开奖记录 排列三开奖历史数据 北京赛车双面盘 香港精准头数一头中特 股票下跌k线 一定牛河北快三走势图 排列3字谜 哪个券商的软件最好用