--- title: 文字背景粒子特效 author: Luckey coverImg: /medias/banner/7.jpg top: false cover: false toc: true mathjax: false summary: '一款jQuery+CSS3的文字背景粒子动画特效，一共6种粒子效果，每种文字背景的粒子效果都不同，有漂浮的有坠落的等等。 ' tags: - jQuery+CSS3 - 粒子特效 - 转载 categories: - Luckey博客篇 - 前端篇 abbrlink: 4b3510a4 reprintPolicy: cc_by date: 2020-03-27 00:00:00 img: password: --- ### 前言 一款jQuery+CSS3的文字背景粒子动画特效，一共6种粒子效果，每种文字背景的粒子效果都不同，有漂浮的有坠落的等等。 ### 0x001 特效演示 ---
This is fires
This is lines
This is hearts
This is bubbles
This is confetti
This is sunbeams
### 0x002 Fires 特效 #### 1. JS 代码 ```javascript ``` #### 2. CSS 代码 ```css ``` #### 3. HTML 代码 ```html
This is fires
``` ### 0x003 Lines 特效 #### 1. JS 代码 ```javascript ``` #### 2. CSS 代码 ```css ``` #### 3. HTML 代码 ```html
This is lines
``` ### 0x004 Hearts 特效 #### 1. JS 代码 ```javascript ``` #### 2. CSS 代码 ```css ``` #### 3. HTML 代码 ```html
This is hearts
``` ### 0x005 Bubbles 特效 #### 1. JS 代码 ```javascript ``` #### 2. CSS 代码 ```css ``` #### 3. HTML 代码 ```html
This is bubbles
``` ### 0x006 Confetti 特效 #### 1. JS 代码 ```javascript ``` #### 2. CSS 代码 ```css ``` #### 3. HTML 代码 ```html
This is confetti
``` ### 0x007 Sunbeams 特效 #### 1. JS 代码 ```javascript ``` #### 2. CSS 代码 ```css ``` #### 3. HTML 代码 ```html
This is sunbeams
```