tsc) and browsers (
The goal is to provide users a more fun and charming experience while browsing/interacting with websites.
The library is intended to only work in browser-like environments, where a global
window are both present. If either of those does not exist, the initialization will fail.
- Browsers (CDN)
- Node.js (npm/yarn)
You can download the latest version of the library from jsdelivr. Alternatively you can include it in your document directly via the CDN.
The library instance is loaded into the global
If you are using a package-managed environment, you can also install the latest version via npm.
You can then either
The library ships with pre-made template effects, to ensure you can get some effects working without having to spend hours tweaking every setting yourself. If you do want to make your own effects from scratch, scroll down to the custom effects section.
As an example, we will implement the confetti effect when a button is clicked.
This is the simplest way to play the effect. Templated effects offer additional customizeability via option overrides, best explained in the following (interactive!) code snippet.
party.range(...) method is a variation method, used to make every instance of the effect unique, in this case by varying the amount of confetti emitted.
If you want to have even more control over the effects that are played, you can completely customize the emitted particles. To ensure you have a good understanding on how customization in the library works, I recommend that you look at the documentation on variations and shapes first. Then, take a look at custom effects - these guide you through creating your own effects.