diff options
| author | Volpeon <git@volpeon.ink> | 2021-12-25 11:51:28 +0100 |
|---|---|---|
| committer | Volpeon <git@volpeon.ink> | 2021-12-25 11:51:28 +0100 |
| commit | 81ed9fa891753ae9a8e090277a15762b03ec6a05 (patch) | |
| tree | 97a00ccb837480ba1a47c3b9cebbe1a3c8109964 /content | |
| parent | Better snowflake severity algorithm (diff) | |
| download | volpeon.ink-81ed9fa891753ae9a8e090277a15762b03ec6a05.tar.gz volpeon.ink-81ed9fa891753ae9a8e090277a15762b03ec6a05.tar.bz2 volpeon.ink-81ed9fa891753ae9a8e090277a15762b03ec6a05.zip | |
More compact snowfall
Diffstat (limited to 'content')
| -rw-r--r-- | content/script.js | 9 |
1 files changed, 4 insertions, 5 deletions
diff --git a/content/script.js b/content/script.js index 78b18b0..dd7729d 100644 --- a/content/script.js +++ b/content/script.js | |||
| @@ -2,22 +2,21 @@ function createSnowFlake() { | |||
| 2 | const snowFlake = document.createElementNS("http://www.w3.org/2000/svg", "svg"); | 2 | const snowFlake = document.createElementNS("http://www.w3.org/2000/svg", "svg"); |
| 3 | const snowFlakeInner = document.createElementNS("http://www.w3.org/2000/svg", "use"); | 3 | const snowFlakeInner = document.createElementNS("http://www.w3.org/2000/svg", "use"); |
| 4 | 4 | ||
| 5 | const aniDuration = (Math.random() * 3 + 2) * 1000; | ||
| 6 | |||
| 7 | snowFlakeInner.setAttribute("href", "/symbols.svg#icon-asterisk"); | 5 | snowFlakeInner.setAttribute("href", "/symbols.svg#icon-asterisk"); |
| 8 | 6 | ||
| 9 | snowFlake.classList.add("o-icon", "o-icon--snow"); | 7 | snowFlake.classList.add("o-icon", "o-icon--snow"); |
| 10 | snowFlake.setAttribute("aria-hidden", "true"); | 8 | snowFlake.setAttribute("aria-hidden", "true"); |
| 11 | 9 | ||
| 12 | snowFlake.style.fontSize = Math.random() * 0.5 + 0.7 + 'em'; | 10 | snowFlake.style.fontSize = Math.random() * 0.5 + 0.7 + 'em'; |
| 13 | snowFlake.style.left = Math.random() * window.innerWidth + 'px'; | 11 | snowFlake.style.left = Math.random() * 100 + '%'; |
| 14 | snowFlake.style.animationDuration = aniDuration + 'ms'; | 12 | snowFlake.style.animationDuration = (Math.random() * 3 + 2) * 1000 + 'ms'; |
| 15 | snowFlake.style.opacity = Math.random(); | 13 | snowFlake.style.opacity = Math.random(); |
| 14 | |||
| 15 | snowFlake.addEventListener("animationend", () => snowFlake.remove()); | ||
| 16 | 16 | ||
| 17 | snowFlake.appendChild(snowFlakeInner); | 17 | snowFlake.appendChild(snowFlakeInner); |
| 18 | document.body.appendChild(snowFlake); | 18 | document.body.appendChild(snowFlake); |
| 19 | 19 | ||
| 20 | setTimeout(() => snowFlake.remove(), aniDuration); | ||
| 21 | setTimeout(() => createSnowFlake(), 50 / Math.log10(window.innerWidth / 1000 + 1)); | 20 | setTimeout(() => createSnowFlake(), 50 / Math.log10(window.innerWidth / 1000 + 1)); |
| 22 | } | 21 | } |
| 23 | 22 | ||
