建站教程

建站教程

Products

当前位置:首页 > 建站教程 >

怎么制作网站上的倒计时牌

GG网络技术分享 2025-03-18 16:07 10


在一些网站中,会有一个倒计时牌,设置一个时间后,这个倒计时牌会自动计算剩余时间,并且显示在倒计时牌上。如下图:

网站上的倒计时牌

下面学做网站论坛就介绍一下怎么在自己做网站时,也可以在自己的网站里做出这样的倒计时牌。

制作这样的倒计时牌,要用到JS代码。

先创建一个空白的DIV,用于显示剩下的天数。

<div class="daojsrt"></div>

在下面再放上倒计时的JS代码,并且在代码里设置到期的时间。

<script language="javascript">
var urodz= new Date("12/24/2021 23:59:59");
var now = new Date();
var ile = urodz.getTime() - now.getTime();
var dni = Math.floor(ile / (1000 * 60 * 60 * 24));
if (dni > 0)
document.write(""+""+dni +"")
else
document.write("0");
</script>

这样就可以自动计算剩余时间了,并且将剩余的天数会显示在DIV里。加上CSS样式就可以制作成倒计时牌了。

完整代码如下:

<div class="daojstitle">2021年考研报名时间倒计时</div>
<div class="daojs">
<div class="daojsrq cf00">
<script language="javascript">
var urodz= new Date("12/24/2021 23:59:59");
var now = new Date();
var ile = urodz.getTime() - now.getTime();
var dni = Math.floor(ile / (1000 * 60 * 60 * 24));
if (dni > 0)
document.write(""+""+dni +"")
else
document.write("0");
</script>
</div>
距离2021年报名还有
<div class="daojsrt"></div>
</div>

标签:

提交需求或反馈

Demand feedback