html
html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<div>
<h1 id="Lhide"></1h1>
</div>
<span id="root" style=display:none>
<h1 class="show"> This Text appeared </h1>
</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
html, body {height:90%;}
html {display:table; width:100%;}
body {
display:table-cell;
text-align:center;
vertical-align:middle;}
#Lhide {
border: 16px solid #f3f3f3;
border-radius: 50%;
border-top: 16px solid blue;
border-right: 16px solid green;
border-bottom: 16px solid red;
border-left: 16px solid pink;
width: 120px;
height:120px;
animation:round 1s linear infinite;
position:relative;
left:30%;
}
h1.show{
color: green;
Enter to Rename, Shift+Enter to Preview
js
js
1
2
3
4
5
6
7
8
window.onload = function () {setTimeout(appeardiv,2000); }
function appeardiv() { document.getElementById('root').style.display= "block";
document.getElementById('Lhide').style.display= "none";
}
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run