【網頁特效】12 個炫酷背景特效庫

做者：lindelof
譯者：前端小智
來源:github

點贊再看，微信搜索 【大遷世界】 關注這個沒有大廠背景，但有着一股向上積極心態人。本文 GitHub https://github.com/qq44924588... 上已經收錄，文章的已分類，也整理了不少個人文檔，和教程資料。

1.particles-bg

地址：https://github.com/lindelof/particles-bg

效果：

2.particles-bg-vue

地址：https://github.com/lindelof/awesome-web-effect

這是一個基於VUE的粒子動畫組件。

3.jquery.ripples

地址：https://github.com/sirxemic/jquery.ripples

jQuery Ripples 插件向HTML添加一層水元素將波紋光標與WebGL的互動。您能夠使用這種效果,讓你的靜態CSS背景圖像更多的互動。

4.MorphingBackgroundShapes

地址：https://github.com/codrops/MorphingBackgroundShapes

這是一個很具裝飾性的網站背景效果，當用戶在滾動到某一頁面後此背景的SVG圖形將隨着變形和移動。

5. SegmentEffect

地址：https://github.com/codrops/SegmentEffect

背景分割裝飾特效。

6.jQuery.BgSwitcher

地址：https://github.com/rewish/jquery-bgswitcher

jQuery.BgSwitcher實現背景圖像切換效果。

7.BackgroundScaleHoverEffect

地址：https://github.com/codrops/BackgroundScaleHoverEffect

使用 CSSclip paths 重現背景縮放懸停特效。

8.ImageGridMotionEffect

地址：https://github.com/codrops/ImageGridMotionEffect

爲背景網格的圖像提供運動懸停特效。

9.jquery.adaptive-backgrounds.js

地址：https://github.com/briangonzalez/jquery.adaptive-backgrounds.js

adaptive-background.js是一款jQuery插件，能夠根據div，img標籤裏圖片的邊框顏色來動態調整父標籤的背景顏色，有點相似iTunes的專輯詳情的效果.

10.fixed-background-effect

地址：https://codyhouse.co/demo/fixed-background-effect/index.html#0

整屏滾動背景懸浮效果。

11.jquery-warpdrive-plugin

地址：https://github.com/NiklasKnaack/jquery-warpdrive-plugin

query-warpdrive-plugin是一款能夠製做基於HTML5 canvas的炫酷星空背景特效的jquery插件。這個星空背景特效可經過配置參數進行靈活的配置，可用鼠標進行互動。

12.RainEffect

使用WebGL在不一樣場景下的一些實驗性降雨和水滴效應。

人才們的 【三連】 就是小智不斷分享的最大動力，若是本篇博客有任何錯誤和建議，歡迎人才們留言，最後，謝謝你們的觀看。

---

代碼部署後可能存在的BUG無法實時知道，過後爲了解決這些BUG，花了大量的時間進行log 調試，這邊順便給你們推薦一個好用的BUG監控工具 Fundebug。

原文：https://github.com/lindelof/a...

---

交流

文章每週持續更新，能夠微信搜索 【大遷世界 】 第一時間閱讀，回覆 【福利】 有多份前端視頻等着你，本文 GitHub https://github.com/qq449245884/xiaozhi 已經收錄，歡迎Star。