2024年很快就要到了
一年真的眨眼及就过去了!
<!DOCTYPE html>
<html>
<head>
<title>新年倒计时</title>
<script>
function countdown() {
var now = new Date();
var eventDate = new Date("January 1, 2022 00:00:00"); // 新年时间
var currentTime = now.getTime();
var eventTime = eventDate.getTime();
var remTime = eventTime - currentTime;
var sec = Math.floor(remTime / 1000);
var min = Math.floor(sec / 60);
var hr = Math.floor(min / 60);
var day = Math.floor(hr / 24);
hr %= 24;
min %= 60;
sec %= 60;
hr = (hr < 10) ? "0" + hr : hr;
min = (min < 10) ? "0" + min : min;
sec = (sec < 10) ? "0" + sec : sec;
document.getElementById("days").innerHTML = day;
document.getElementById("hours").innerHTML = hr;
document.getElementById("minutes").innerHTML = min;
document.getElementById("seconds").innerHTML = sec;
setTimeout(countdown, 1000);
}
</script>
<style>
body {
font-family: Arial, sans-serif;
text-align: center;
}
h1 {
font-size: 3em;
margin-top: 50px;
}
.countdown {
display: flex;
justify-content: center;
align-items: center;
margin-top: 50px;
}
.countdown div {
border-radius: 5px;
background-color: #333;
color: #fff;
font-size: 2em;
padding: 20px;
margin: 0 10px;
}
</style>
</head>
<body onload="countdown()">
<h1>新年倒计时</h1>
<div class="countdown">
<div>
<span id="days"></span>
<div>天</div>
</div>
<div>
<span id="hours"></span>
<div>小时</div>
</div>
<div>
<span id="minutes"></span>
<div>分钟</div>
</div>
<div>
<span id="seconds"></span>
<div>秒</div>
</div>
</div>
</body>
</html>
源码截图
版权说明
本站提供的一切软件、教程和内容信息仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。本站信息来自网络收集整理,如果您喜欢该程序和内容,请支持正版,购买注册,得到更好的正版服务。我们非常重视版权问题,如有侵权请邮件:axxgzs@qq.com与我们联系处理。敬请谅解!!