jQuery.輝け.js

Cagayake (輝け, "glitter" or "luster") - create dynamic background image with jQuery.

Project page (github)

Demo

5つの光が導く未来!輝け!スマイルプリキュア!
<div style="height: 100px; background: rgba(255, 255, 255, 0.3);" id="cagayakeDemo">
  5つの光が導く未来!輝け!スマイルプリキュア!
</div>


                  
$('#cagayakeDemo').cagayake({
                    edgeLength: 100,
                    color: {H:20, S:70, L:53},
                    colorShake: 30,
                    animation: {color: 20}});
                  

Options

edgeLength
Number
三角形の一辺の長さ
offset
Object {x: Number, y: Number}
三角形同士の間隔
Color
Object {H: Number, S: Number, L: Number}
色の値 (HSL)
colorShake
Number
色のゆらぎ
0で単色 360 でめっちゃカラフル
svgOffset
Object {x: Number, y: Number}
三角の並びの開始値点をずらす
opacity
Number (0〜1.0)
透明度
animation
Object {color: Number}
輝かせる
Numberの大きさが大きいといろんな色になる

License

MIT.