<html>
<head>
<title>Count Down 2</title>
<style>
#show {
position: absolute;
top: 50%;
left: 50%;
width: 60%;
height: 60%;
margin: -30% -30% -30% -30% ;
background-color: black;
color: white;
text-align: center;
font-family: "微軟正黑體";
font-size: 2em;
}
</style>
</head>
<body>
<div id="show">
<h1>會考倒數</h1>
<h1 id="timer"></h1>
</div>
<script>
function countdown(gy,gm,gd,ghour,gmin,gsec) {
let now = new Date();
let goal = new Date(gy,gm-1,gd);
let diff = goal.getTime() - now.getTime();
let s = Math.floor( diff / 1000 ) % 60;
let m = Math.floor( diff / 1000 / 60 ) % 60;
let h = Math.floor( diff / 1000 / 60 / 60 ) % 24;
let d = Math.floor( diff / 1000 / 60 / 60 / 24 );
let count = [d, align(h), align(m), align(s)];
console.log(count);
return count;
}
function align(num) {
num = (( num < 10 ) ? "0" : "") + num;
return num;
}
function timer(){
let rest = countdown(2018,5,19);
let timer = document.getElementById('timer');
let text = rest[0] + "天" + rest[1] + "時" + rest[2] + "分" + rest[3] + "秒";
timer.textContent = text;
}
setInterval(timer, 1000);
</script>
</body>
</html>
沒有留言:
張貼留言