大家好，我是小编蓬仔。 蓬仔运营的Q站主要是一个分享资源和活动的网站，所以我经常分享一些活动，也就是活动有结束时间。 前段时间刚访问了其他网站，看到对应的事件有对应的结束倒计时效果。 活动结束后会提示活动已经结束，这对用户来说是更好的体验，所以我也写了这个效果，分享给大家。

因为考虑到有些网站不使用jq，或者jq版本低，所以使用native来实现效果，这样任何网站都可以使用。

作者：百变蓬仔

效果如下图：

如果事件还没有结束，到结束时间的距离会以绿色显示。 如果它已过期，它将在活动结束时显示为红色。

下面是对应的html和js代码

修改html代码span标签中的时间为过期时间，格式必须正确，如2018-08-08 24:00:00，并放置 它需要显示在哪里。

将js代码放在公共js中，或者其他导入的js文件中。

<span id="ActivityDate">2020-05-08 24:00:00span>

JavaScript

样式方面，没有美化，以后有时间会更新美化版。