纯水贴一篇,不知道该写些什么,分享一个倒计时的代码吧
<style>
.time {
color: #fff;
background:url(图片地址);
height:200px;
width:980px
text-transform: uppercase;
display: flex;
justify-content: center;
}
.time span {
padding: 110px 14px;
font-size: 0.8rem;
}
.time span div {
font-size: 3rem;
background:rgba(0,0,0,0.3);
}
</style>
<div class="time"><span style="font-size: 3rem;"> 距离圣诞节还有:</span>
<span>
<div id="d">
00
</div>
天 </span> <span>
<div id="h">
00
</div>
时 </span> <span>
<div id="m">
00
</div>
分 </span> <span>
<div id="s">
00
</div>
秒 </span>
</div>
</div>
<script>
const comingdate = new Date("12 24, 2020 00:00:00");
const d = document.getElementById("d");
const h = document.getElementById("h");
const m = document.getElementById("m");
const s = document.getElementById("s");
const countdown = setInterval(() => {const now = new Date();
const des = comingdate.getTime() - now.getTime();
const days = Math.floor(des / (1000 * 60 * 60 * 24));
const hours = Math.floor((des % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
const mins = Math.floor((des % (1000 * 60 * 60)) / (1000 * 60));
const secs = Math.floor((des % (1000 * 60)) / 1000);
d.innerHTML = getTrueNumber(days);
h.innerHTML = getTrueNumber(hours);
m.innerHTML = getTrueNumber(mins);
s.innerHTML = getTrueNumber(secs);
if (x <= 0) clearInterval(x);
}, 1000);
const getTrueNumber = x => (x < 10 ? "0" + x : x);
</script>