Particleground簡介：

Particleground是一個JavaScript插件，用于時髦的后臺粒子系統。包括鼠標在桌面設備和移動設備上的陀螺儀控制的可選視差效果。在支持HTML5畫布的瀏覽器中工作。

初始化：

particleground(document.getElementById('your-element');

注意事項：

v1.0.0以上版本支持js原生調用，不必依賴jquery。

具體使用方法：

1)引入文件

2)html

3)js調用

// 原生js(要求v1.0.0以上版本):

particleground(document.getElementById('particles');

//可以根據下面表格中參數說明設定相應參數

particleground(document.getElementById('particles'), {

dotColor: '#ff0000',

lineColor: '#ff0000'

});

// jQuery：

$('#particles').particleground();

//可以根據下面表格中參數說明設定相應參數

$('#particles').particleground({

dotColor: '#ff0000',

lineColor: '#ff0000'

});

參數：

名稱

默認值

描述

minSpeedX

0.1

maxSpeedX

0.7

minSpeedY

0.1

maxSpeedY

0.7

directionX

‘center’

可用值 ‘center’, ‘left’ 和’right’.

directionY

‘center’

可用值’center’, ‘up’ 和 ‘down’.

density

10000

確定生成多少料子

dotColor

‘#666666’

點的顏色

lineColor

‘#666666’

線的顏色

particleRadius

7

粒子半徑

Dot size

點的大小

lineWidth

1

線的寬度

curvedLines

false

線是否彎曲

proximity

100

兩個點間多遠開始連

parallax

true

視差效果

parallaxMultiplier

5

數量越低,視差效果更強

onInit

function() {}

初始時調用函數

onDestroy

function() {}

銷毀時調用函數

項目地址：

https://github.com/jnicol/particleground

參考：

http://www.jq22.com/jquery-info566

http://www.jqhtml.com/8478.html

總結

以上是生活随笔為你收集整理的php粒子背景特效_粒子背景特效Particleground.js插件使用解析_蓝戒的博客的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。