<html>
<head>
<meta charset="UTF-8">
<title>Countdown</title>
<SCRIPT type="text/javascript">
function CountDown() {
// var EndTime= new Date('2021/06/29 9:00:00'); //截止时间
var EndTime = 1624928400000;
var NowTime = new Date();
var t =EndTime - NowTime.getTime();
// if (t<=0) {
// document.getElementById("t_s").innerHTML = "Time is finished! You don't have more time!!!";
// clearInterval(timer);
// };
var d=Math.floor(t/1000/60/60/24);
var h=Math.floor(t/1000/60/60%24);
var m=Math.floor(t/1000/60%60);
var s=Math.floor(t/1000%60);
if (d+h+m+s >= 0) {
msg = Math.floor(t / 60);
secondsMsg = Math.floor(t % 60);
if (msg == 0 ) {
document.all["divcss5"].innerHTML = "Time is finished!!!";
} else if (msg < 10) {
// document.all["divcss5"].innerHTML = "0" + msg;
} else {
// document.all["divcss5"].innerHTML = msg;
if (d>0) {
document.getElementById("t_d").innerHTML = d + "天";
}else{
document.getElementById("t_d").innerHTML = "";
}
if (h > 0 ) {
document.getElementById("t_h").innerHTML = h + "时";
}else{
document.getElementById("t_h").innerHTML = "";
}
if (m> 0) {
document.getElementById("t_m").innerHTML = m + "分";
}else{
document.getElementById("t_m").innerHTML = "";
}
if (s> 0) {
document.getElementById("t_s").innerHTML = s + "秒";
}else{
document.getElementById("t_s").innerHTML = "";
}
}
// document.all["divcss5"].innerHTML = "t = " + t
setInterval(CountDown,1000);
} else {
clearInterval(timer);
document.all["timerSeconds"].innerHTML = "Time is finished! You don't have more time!!!";
}
}
timer = setInterval("CountDown()", 1000);
</SCRIPT>
<style type="text/css">
body{
background-color: black;
text-align: center;
}
#NeWolf{
top: 40%;
position: relative;
width: auto; max-width: 100%;
height: auto; max-height: 100%;
}
#divcss5{
top: 5%
position: absolute;
width: auto; max-width: 100%;
height: auto; max-height: 100%;
//border: 1px solid green;
}
#timerSeconds{
top: 40%;
position: relative;
width: auto; max-width: 100%;
height: auto; max-height: 100%;
//border: 1px solid red;
}
#CountMsg{
top: 40%;
position: relative;
width: auto; max-width: 100%;
height: auto; max-height: 100%;
z-index:2;
/*border: 1px solid red;*/
}
</style>
</head>
<body>
<div id="NeWolf"style="position:relative;">
<img src="" />
<div id="CountMsg" style="color:white; font-size: 70" class="HotDate" z-index:2; ">
<span id="t_d"></span>
<span id="t_h"></span>
<span id="t_m"></span>
<span id="t_s"></span>
</div>
</div>
<div id="divcss5" style="color:white; font-size: 70"></div>
<span> </span>
<div id="timerSeconds" style="color:white; font-size: 70"</div>
</body>
</html>
运行效果：
countdown.jpg
