diff options
| author | Volpeon <git@volpeon.ink> | 2021-12-28 13:26:25 +0100 |
|---|---|---|
| committer | Volpeon <git@volpeon.ink> | 2021-12-28 13:26:25 +0100 |
| commit | 65a63deb9b939b8f18c81386ed369a4232811ad8 (patch) | |
| tree | c6981ff525e2e5c25e2da01b3bc14f7d90dcf212 | |
| parent | Added project (diff) | |
| download | volpeon.ink-65a63deb9b939b8f18c81386ed369a4232811ad8.tar.gz volpeon.ink-65a63deb9b939b8f18c81386ed369a4232811ad8.tar.bz2 volpeon.ink-65a63deb9b939b8f18c81386ed369a4232811ad8.zip | |
Use timeout to remove snowflake
| -rw-r--r-- | content/script.js | 5 |
1 files changed, 3 insertions, 2 deletions
diff --git a/content/script.js b/content/script.js index 763734e..fd275b6 100644 --- a/content/script.js +++ b/content/script.js | |||
| @@ -7,6 +7,7 @@ function createSnowFlake() { | |||
| 7 | 7 | ||
| 8 | const snowFlake = document.createElementNS("http://www.w3.org/2000/svg", "svg"); | 8 | const snowFlake = document.createElementNS("http://www.w3.org/2000/svg", "svg"); |
| 9 | const snowFlakeInner = document.createElementNS("http://www.w3.org/2000/svg", "use"); | 9 | const snowFlakeInner = document.createElementNS("http://www.w3.org/2000/svg", "use"); |
| 10 | const aniDuration = (Math.random() * 3 + 2) * 1000; | ||
| 10 | 11 | ||
| 11 | snowFlakeInner.setAttribute("href", "/symbols.svg#icon-asterisk"); | 12 | snowFlakeInner.setAttribute("href", "/symbols.svg#icon-asterisk"); |
| 12 | 13 | ||
| @@ -15,10 +16,10 @@ function createSnowFlake() { | |||
| 15 | 16 | ||
| 16 | snowFlake.style.fontSize = Math.random() * 0.5 + 0.7 + 'em'; | 17 | snowFlake.style.fontSize = Math.random() * 0.5 + 0.7 + 'em'; |
| 17 | snowFlake.style.left = Math.random() * 100 + '%'; | 18 | snowFlake.style.left = Math.random() * 100 + '%'; |
| 18 | snowFlake.style.animationDuration = (Math.random() * 3 + 2) * 1000 + 'ms'; | 19 | snowFlake.style.animationDuration = aniDuration + 'ms'; |
| 19 | snowFlake.style.opacity = Math.random(); | 20 | snowFlake.style.opacity = Math.random(); |
| 20 | 21 | ||
| 21 | snowFlake.addEventListener("animationend", () => snowFlake.remove()); | 22 | setTimeout(() => snowFlake.remove(), aniDuration); |
| 22 | 23 | ||
| 23 | snowFlake.appendChild(snowFlakeInner); | 24 | snowFlake.appendChild(snowFlakeInner); |
| 24 | document.body.appendChild(snowFlake); | 25 | document.body.appendChild(snowFlake); |
