DEV Community

Ahmet İlhan
Ahmet İlhan

Posted on

Website Snowfall Effect

#watercooler

https://github.com/ahmetilhan24/snow-fall-effect

Snow Fall Effect

It provides a realistic snowfall effect to your site to make your websites look more aesthetic during the winter months.

Insatalation

HTML File 
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <!--import inside head tag--> <script src="../dist/index.js" type="module"></script> </head> <body> <!--Call it snowfall here too.--> <script type="module" defer> import SnowFall from "../dist/index.js"; new SnowFall(); </script> </body> </html>
Enter fullscreen mode Exit fullscreen mode
Vue 
import SnowFall from "snow-fall" export default { data() { return { msg: 'foo' } } mounted() { new SnowFall(); } }
Enter fullscreen mode Exit fullscreen mode

Configuration

Types 
{ sizeRange: [number, number], color: string, speed: number, }
Enter fullscreen mode Exit fullscreen mode 
new SnowFall({ sizeRange: [10, 20], // default (min 0) color: "#fff", // default speed: 10, // default (second) });
Enter fullscreen mode Exit fullscreen mode

Coded by ahmetilhan

Top comments (0)