零基础学做网站培训介绍

当前位置:

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

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

网站上的倒计时牌

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

制作这样的倒计时牌,要用到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>

发表评论

邮箱地址不会被公开。 必填项已用*标注

相关教程

  • 我们在自己建网站时,有时需要在自己的网站上放一个倒计时功能。例如:离2020年还有XX年XX月XX日X时X分X秒,包含 年、月、日、时、分、秒,并且这个时
  • 在我们建网站时,为了让浏览用户知道某些内容多少秒之后显示,可以在自己的网站上插入倒计时功能。例如在学做网站论坛的免费建站课程,视频载入需
  • 在一些网站中,会有一个倒计时牌,设置一个时间后,这个倒计时牌会自动计算剩余时间,并且显示在倒计时牌上。如下图:下面学做网站论坛就介绍