可为HTML元素添加精美粒子动画效果的jQuery插件 A javascript utility that adds beautiful particle effects to your javascript events

ClickSpark.js

ClickSpark.js is a javascript utility that adds beautiful particle effects to your javascript events.
Add image-files as single particles and configure where and when a particle fountain should be fired.



Automatic click binding
default particle effect

Use jQuery to add ClickSpark to HTML-elements. On a click on the button-tag the default sparkling effect will be fired.

Automatic configured click binding
customized particle effect

Use jQuery to add ClickSpark to HTML-elements. Configure particle attributes for example like this

Independent particle binding
customized particle effect

Use jQuery to fire ClickSpark independently for example. The particles will be targeted to the center position of the HTML-element with the className ".sparklingDiv". So the particle target can be placed everywhere via CSS.
$('.button-1').clickSpark();
$('.button-2').clickSpark({
    particleImagePath: '../particle-1.png',
    particleCount: 35,
    particleSpeed: 12,
    particleSize: 12
    particleRotationSpeed: 20
});
$(document).ready(function () {
    $('.button-3').click(function () {
        clickSpark.fireParticles($('.sparklingDiv'));
    });
});

DEMO

DEMO

DEMO

target div