diff options
-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 | ||