html
html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!DOCTYPE html>
<!--
- update: Correct Sound Effect is fixed.
-->
<html>
<head>
<title>Page Title</title>
<link href="https://fonts.googleapis.com/css?family=Press+Start+2P&display=swap" rel="stylesheet">
</head>
<body class='cn'>
<div style='padding-bottom: 30px'>
<div id='qu' class='cn'>
<h1>Loading</h1>
</div>
<div id='ch'>
<span id='a1' class='ch altr'>AB</span>
<span id='a2' class='ch altr'>BC</span>
<span id='a3' class='ch altr'>CD</span>
<span id='a4' class='ch altr'>DE</span>
</div>
</div>
</body>
</html>
Enter to Rename, Shift+Enter to Preview
css
css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
body {
background-color: #f3823a;
width: 100vw;
height: 100vh;
margin: 0;
font-family: 'Press Start 2P', cursive;
color: #364259;
}
#qu{
background-color: #ecd43b;
width: 90vw;
min-height: 200px;
border-radius: 10px;
box-shadow: 1px 1px 4px 2px #00000045;
margin: 0 auto;
text-align: center;
}
#ch{
position: relative;
top: 20px;
display: flex;
width: 80vw;
margin: 0 auto;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
Enter to Rename, Shift+Enter to Preview
js
js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
window.onload = (e) => {
let elements;
let cd=5;
let timer;
let game=true;
let qa;
let point = 0;
let altr = Array.from(document.getElementsByClassName('altr'));
let rando = setInterval(()=>{
let done = true;
for(let e of altr){
if(e.classList.contains('altr'))done=false;
let r;
do{
r=Math.random().toString(36).replace(/[^a-z]+/g, '').substr(0, 2).toUpperCase();
}while(r.length<2);
e.innerHTML = r;
}
if(done){
clearInterval(rando);
for(let choice of Array.from(document.getElementsByClassName('ch'))){
choice.innerHTML = "...";
}
let xx = setInterval(()=>{
if(intro.length > 0){
document.getElementById('qu').innerHTML = intro.splice(0,1)[0];
}else{
clearInterval(xx);
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run