12 個炫酷背景特效庫

前端小智
作者:lindelof
譯者:前端小智
來源:github
點贊再看,微信搜索大遷世界,B站關注前端小智這個沒有大廠背景,但有著一股向上積極心態人。本文 GitHub https://github.com/qq44924588... 上已經收錄,文章的已分類,也整理了很多我的文檔,和教程資料。

最近開源了一個 Vue 組件,還不夠完善,歡迎大家來一起完善它,也希望大家能給個 star 支持一下,謝謝各位了。

github 地址:https://github.com/qq44924588...

1.particles-bg

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

效果:

clipboard.png

clipboard.png

clipboard.png

2.particles-bg-vue

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

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

clipboard.png

clipboard.png

3.jquery.ripples

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

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

clipboard.png

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 重現背景縮放懸停特效。

https://klxxcdn.oss-cn-hangzhou.aliyuncs.com/histudy/hrm/media/66/7116.gif

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的專輯詳情的效果.

clipboard.png

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和完善,大家面試可以參照考點復習,另外關注公眾號,后臺回復福利,即可看到福利,你懂的。

閱讀 2.8k

終身學習者
我要先堅持分享20年,大家來一起見證吧。
avatar
前端小智
前端開發工程師

我不是什么大牛,我其實想做的就是一個傳播者。內容可能過于基礎,但對于剛入門的人來說或許是一個窗口,一個解惑之窗。我要先堅持分享20年,大家來一起見證吧。

57.1k 聲望
9.9k 粉絲
0 條評論
avatar
前端小智
前端開發工程師

我不是什么大牛,我其實想做的就是一個傳播者。內容可能過于基礎,但對于剛入門的人來說或許是一個窗口,一個解惑之窗。我要先堅持分享20年,大家來一起見證吧。

57.1k 聲望
9.9k 粉絲
宣傳欄
一本到在线是免费观看_亚洲2020天天堂在线观看_国产欧美亚洲精品第一页_最好看的2018中文字幕 <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <文本链> <文本链> <文本链> <文本链> <文本链> <文本链>