Luthics
/
TiaoZhan_Homework
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add forth homework

This commit is contained in:
Luthics 2022-10-17 23:39:10 +08:00
parent 4541a49ee5
commit d4a14d6bb3
5 changed files with 119 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
4/index.css Normal file
View File

@ -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;
}

19
4/index.html Normal file
View File

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>挑战网作业 4</title>
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
<div class="balls">
<div class="ball b1"></div>
<div class="ball b2"></div>
<div class="ball b3"></div>
<div class="ball timer">0</div>
</div>
<script src="index.js"></script>
</body>
</html>

24
4/index.js Normal file
View File

@ -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);

26
4/index.ts Normal file
View File

@ -0,0 +1,26 @@
let t = 0;
let b1 = <HTMLElement>document.getElementsByClassName("b1")[0],
b2 = <HTMLElement>document.getElementsByClassName("b2")[0],
b3 = <HTMLElement>document.getElementsByClassName("b3")[0],
timer = <HTMLElement>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);

14
4/package.json Normal file
View File

@ -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"
}
}