-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
81 lines (66 loc) · 2.33 KB
/
index.html
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
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Countdown 2020</title>
<link rel="stylesheet" href="style.css">
<meta name="google-site-verification" content="ndT5RKpCFNEEXKspVM924ThdQGoldSO8NMMFlFbOJdk" />
</head>
<body id="bodyid">
<div id="containerid" class="container" >
<h2><span>Countdown to Year</span>2020</h2>
<div class="countdown">
<div id="day">NA</div>
<div id="hour">NA</div>
<div id="minute">NA</div>
<div id="second">NA</div>
</div>
<div class="credit" style="position: relative; top: 120px;"><p>by Ken</p></div>
</div>
<script type="text/javascript">
// document.getElementById('bodyid').addEventListener("click", () =>{
document.getElementById('bodyid').style = "background: #000 url(mouse.jpg); background-size:cover;";
document.getElementById('containerid').style = "background: #000 url(mouse.jpg); background-size:cover;";
// var newImg = "mouse.jpg";
// changebg('bodyid',newImg);
// changebg('container',newImg);
// })
var countDate = new Date('Jan 1,2020 00:00:00').getTime();
function newYear(){
var now = new Date().getTime();
if (countDate>now)
gap = countDate - now;
else{
gap = now-countDate;
}
var second = 1000;
var minute = second * 60;
var hour = minute * 60;
var day = hour *24;
var d = Math.floor(gap / (day));
var h = Math.floor((gap % (day)) / (hour));
var m = Math.floor((gap % (hour)) / (minute));
var s = Math.floor((gap % (minute)) / (second));
document.getElementById('day').innerText = d;
document.getElementById('hour').innerText = h;
document.getElementById('minute').innerText = m;
document.getElementById('second').innerText = s;
if (gap<=0){
var newImg = "mouse.jpg";
document.getElementById('bodyid').style = "background: #000 url(mouse.jpg); background-size:cover;";
document.getElementById('containerid').style = "background: #000 url(mouse.jpg); background-size:cover;";
}
}
function changebg(tagname, newImg){
document.getElementById(tagname).style = `background: #000 url(${newImg}) cover`;
}
setInterval(function(){
newYear();
},1000)
</script>
<button type="button"
onclick="document.getElementById('demo').innerHTML = Date()">
Click me to display Date and Time.</button>
<p id="demo"></p>
</body>
</html>