6個絢麗時尚的前端3D效果及原始碼

edithfang發表於2014-08-11

這篇文章挑選了 6 個前沿的絢麗的 3D 展示效果,希望對你有所幫助。

1.  3D自由立體旋轉現實物理效果

3D 自由立體旋轉是一個基於 HTML5 技術的實驗,模擬現實物理效果,讓你在 Web 中感受自然物體的 3D 自由立體旋轉運動。玩法介紹:可以隨意拖動滑鼠、按住滑鼠左鍵選中旋轉物體、或者按住滑鼠滑輪放大或者縮小,有不同的效果,趕緊來體驗一下。



原始碼下載/  線上演示

2.  CSS3學習骰子動畫效果(滾輪放大可以看骰子裡的世界!)

這個外掛整合了一些非常好的 JavaScript 庫,提供一個方便使用的文字動畫外掛,可以讓你 3D 全方位的看到物體裡邊的世界喲。



原始碼下載/  線上演示

3.  jquery推開窗戶3D特效




jquery 實現的推開窗戶的 3D 特效,會在當滑鼠游標移動到接近(或通過)視口(viewport)的頂部的時候觸發。

原始碼下載/   線上演示

4.  jquery html內容3D翻轉顯示

rotate3di.js 是一個用於實現翻轉的 JavaScript 庫。您可以設定動態光的位置,可定製的陰影。不依賴於第三方庫。能在支援 FireFox、Chrome、Safari、傲遊、搜狗、360 瀏覽器。

 



原始碼下載/   線上演示

5.  jquery動畫洗牌圖片3D特效

modernizr.custom.34807.js 是一款用於時尚、現代的 3D 效果的 JavaScript 庫,你需要做的就是新增您所要實現的圖效,剩下的任務就交給 js 演算法了,使用非常簡單。提供了動畫洗牌圖片效果,滿足開發的各種場合需要。



原始碼下載 /   線上演示

6. 實現360度多角度展示效果

使用 jquery 和 html 結合實現超逼真的方塊展示效果,呈現 3D 畫面的技術,有別於過去需要安裝瀏覽器外掛,只需要編寫網頁程式碼即可實現 3D 影像的展示。



原始碼下載 /   線上演示
相關閱讀
評論(3)

相關文章