From ab7d889e897bd1a2a98b41e55872222ac5068ec4 Mon Sep 17 00:00:00 2001
From: Sam <74021826+x39OME@users.noreply.github.com>
Date: Thu, 18 May 2023 17:29:11 +0300
Subject: [PATCH] Add files via upload
---
100_projects/86-white-snow-rain/index.html | 11 +++++++++++
100_projects/86-white-snow-rain/script.js | 15 ++++++++++++++
100_projects/86-white-snow-rain/style.css | 23 ++++++++++++++++++++++
3 files changed, 49 insertions(+)
create mode 100644 100_projects/86-white-snow-rain/index.html
create mode 100644 100_projects/86-white-snow-rain/script.js
create mode 100644 100_projects/86-white-snow-rain/style.css
diff --git a/100_projects/86-white-snow-rain/index.html b/100_projects/86-white-snow-rain/index.html
new file mode 100644
index 0000000..49f3f1b
--- /dev/null
+++ b/100_projects/86-white-snow-rain/index.html
@@ -0,0 +1,11 @@
+
+
+
+
+
+ White Snow Rain
+
+
+
+
+
\ No newline at end of file
diff --git a/100_projects/86-white-snow-rain/script.js b/100_projects/86-white-snow-rain/script.js
new file mode 100644
index 0000000..634f19e
--- /dev/null
+++ b/100_projects/86-white-snow-rain/script.js
@@ -0,0 +1,15 @@
+function createSnow () {
+ const snow = document.createElement("div");
+ snow.classList.add("snow");
+ snow.style.left = Math.random() * 100 + "vw";
+ snow.style.animationDuration = Math.random() * 2 + 3 + "s";
+
+ snow.innerText = "❄️️";
+
+ document.body.appendChild(snow);
+
+ setTimeout(() => {
+ snow.remove();
+ }, 5000);
+}
+setInterval(createSnow, 300);
\ No newline at end of file
diff --git a/100_projects/86-white-snow-rain/style.css b/100_projects/86-white-snow-rain/style.css
new file mode 100644
index 0000000..d065442
--- /dev/null
+++ b/100_projects/86-white-snow-rain/style.css
@@ -0,0 +1,23 @@
+* {
+ box-sizing: border-box;
+}
+body {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin: 0;
+ min-height: 100vh;
+ background: #ADD8E6;
+}
+.snow {
+ position: fixed;
+ top: -1vh;
+ font-size: 2rem;
+ transform: translateY(0);
+ animation: fall 3s linear forwards;
+}
+@keyframes fall {
+ to {
+ transform: translateY(105vh);
+ }
+}
\ No newline at end of file