diff --git a/4/index.css b/4/index.css
new file mode 100644
index 0000000..f791f04
--- /dev/null
+++ b/4/index.css
@@ -0,0 +1,36 @@
+div {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.balls {
+ width: 100vw;
+ height: 100vh;
+}
+
+.ball {
+ width: 30vh;
+ height: 30vh;
+ border-radius: 50%;
+ margin: 5vh;
+}
+
+.b1 {
+ background-color: red;
+ font-size: 100px;
+}
+
+.b2 {
+ font-size: 100px;
+}
+
+.b3 {
+ font-size: 100px;
+}
+
+.timer {
+ background-color: black;
+ color: red;
+ font-size: 100px;
+}
\ No newline at end of file
diff --git a/4/index.html b/4/index.html
new file mode 100644
index 0000000..dfb34e4
--- /dev/null
+++ b/4/index.html
@@ -0,0 +1,19 @@
+
+
+
+
+
+ 挑战网作业 4
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/4/index.js b/4/index.js
new file mode 100644
index 0000000..c837332
--- /dev/null
+++ b/4/index.js
@@ -0,0 +1,24 @@
+var t = 0;
+var b1 = document.getElementsByClassName("b1")[0], b2 = document.getElementsByClassName("b2")[0], b3 = document.getElementsByClassName("b3")[0], timer = document.getElementsByClassName("timer")[0];
+function c_timer() {
+ console.log(t);
+ t += 1;
+ if (t == 13)
+ t = 0;
+ if (t < 6) {
+ b3.style["background-color"] = "unset";
+ b1.style["background-color"] = "red";
+ timer.innerHTML = 6 - t;
+ }
+ else if (t < 8) {
+ b1.style["background-color"] = "unset";
+ b2.style["background-color"] = "green";
+ timer.innerHTML = 8 - t;
+ }
+ else if (t < 13) {
+ b2.style["background-color"] = "unset";
+ b3.style["background-color"] = "yellow";
+ timer.innerHTML = 13 - t;
+ }
+}
+setInterval(c_timer, 1000);
diff --git a/4/index.ts b/4/index.ts
new file mode 100644
index 0000000..7ffcf9d
--- /dev/null
+++ b/4/index.ts
@@ -0,0 +1,26 @@
+let t = 0;
+let b1 = document.getElementsByClassName("b1")[0],
+ b2 = document.getElementsByClassName("b2")[0],
+ b3 = document.getElementsByClassName("b3")[0],
+ timer = document.getElementsByClassName("timer")[0];
+function c_timer() {
+ console.log(t);
+ t += 1;
+ if (t == 13) t = 0;
+ if (t < 6) {
+ b3.style["background-color"] = "unset";
+ b1.style["background-color"] = "red";
+ timer.innerHTML = 6-t as string;
+ }
+ else if(t<8){
+ b1.style["background-color"] = "unset";
+ b2.style["background-color"] = "green";
+ timer.innerHTML = 8-t as string;
+ }
+ else if(t<13){
+ b2.style["background-color"] = "unset";
+ b3.style["background-color"] = "yellow";
+ timer.innerHTML = 13-t as string;
+ }
+}
+setInterval(c_timer, 1000);
\ No newline at end of file
diff --git a/4/package.json b/4/package.json
new file mode 100644
index 0000000..e8662cc
--- /dev/null
+++ b/4/package.json
@@ -0,0 +1,14 @@
+{
+ "name": "tianzhan4",
+ "version": "1.0.0",
+ "description": "Homework for tz",
+ "main": "index.js",
+ "scripts": {
+ "test": "echo \"Error: no test specified\" && exit 1"
+ },
+ "author": "Luthics",
+ "license": "ISC",
+ "dependencies": {
+ "typescript": "^4.8.4"
+ }
+}