Author: | Andrey-1988-dev |
---|---|
Views Total: | 2,191 views |
Official Page: | Go to website |
Last Update: | November 27, 2023 |
License: | MIT |
Preview:

Description:
Yet another snowfall animation library that uses HTML5 canvas and requestAnimationFrame API to generate snowflakes falling on the page.
The number, size, speed, color, and even symbol of the snowflakes are fully customizable to match your design needs. Ideal for spicing up landing pages, games, holiday themes, or just creating some seasonal ambiance on your site.
How to use it:
1. Download and import the Snowfall.js
script into your web project.
<script src="snowfall.js"></script>
2. Create a new Snowfall
instance, and the library will do the rest.
let snowfall = new Snowfall({ // options here });
3. Customize the snowflakes with the following options.
let snowfall = new Snowfall({ // number of snowflakes count: 100, // min/max size minRadius: 10, maxRadius: 30, // min/max speed minSpeed: 3, maxSpeed: 10, // custom symbol or text for snowflakes text: "\u2744", // color of snowflakes color: "#ffffff", // z-index for the canvas zIndex: "1000" });
Changelog:
v1.1.0 (11/27/2023)
- Add a method to destroy the snowfall and remove the canvas element;
- Change some functions to arrow functions for consistency;
- Simplify some conditions for checking the visibility and position of the snowflakes;
- Change some calculations for the speed and size of the snowflakes;
- Fix some minor issues with the canvas resizing and appending;
- Improve the cross-browser compatibility and performance of the script;