纯代码给WordPress网站添加节日倒计时功能 可做任意倒计时

今天买卖易资源网给大家分享的是给自己的WordPress网站添加节日倒计时的功能,理论上这个方法适用于任何网站的,而且可以做其他倒计时用途使用,接下来看如何实现吧。

操作方法分为WordPress网站与其他程序网站两种。

功能演示

WordPress

1、进入WordPress网站后台

2、选择外观-小工具-添加自定义html小工具。

3、填写如下代码:

<div class="gn_box">
    <h1><center><font color=#E80017>2</font><font color=#D1002E>0</font><font color=#BA0045>2</font><font color=#A3005C>0</font><font
            color=#8C0073>年</font><font color=#75008A>-</font><font color=#5E00A1>新</font><font
            color=#4700B8>年</font><font color=#3000CF>倒</font><font color=#1900E6>计</font><font color=#0200FD>时</font>
    </center></h1>
    <center>
        <div id="CountMsg" class="HotDate">
            <span id="t_d">157 天</span>
            <span id="t_h">9 时</span>
            <span id="t_m">7 分</span>
            <span id="t_s">42 秒</span>
        </div>
    </center>
    <script type="text/javascript"> function getRTime() {
        var EndTime = new Date('2020/01/25 00:00:00');
        var NowTime = new Date();
        var t = EndTime.getTime() - NowTime.getTime();
        var d = Math.floor(t / 1000 / 60 / 60 / 24);
        var h = Math.floor(t / 1000 / 60 / 60 % 24);
        var m = Math.floor(t / 1000 / 60 % 60);
        var s = Math.floor(t / 1000 % 60);
        document.getElementById("t_d").innerHTML = d + " 天";
        document.getElementById("t_h").innerHTML = h + " 时";
        document.getElementById("t_m").innerHTML = m + " 分";
        document.getElementById("t_s").innerHTML = s + " 秒";
    }
    setInterval(getRTime, 1000);
    </script>
</div>

4、点击保存,即可前台浏览查看。

其他网站

1、复制如下代码:

<div class="gn_box">
    <h1><center><font color=#E80017>2</font><font color=#D1002E>0</font><font color=#BA0045>2</font><font color=#A3005C>0</font><font
            color=#8C0073></font><font color=#75008A>-</font><font color=#5E00A1></font><font
            color=#4700B8></font><font color=#3000CF></font><font color=#1900E6></font><font color=#0200FD></font>
    </center></h1>
    <center>
        <div id="CountMsg" class="HotDate">
            <span id="t_d">157 天</span>
            <span id="t_h">9 时</span>
            <span id="t_m">7 分</span>
            <span id="t_s">42 秒</span>
        </div>
    </center>
    <script type="text/javascript"> function getRTime() {
        var EndTime = new Date('2020/01/25 00:00:00');
        var NowTime = new Date();
        var t = EndTime.getTime() - NowTime.getTime();
        var d = Math.floor(t / 1000 / 60 / 60 / 24);
        var h = Math.floor(t / 1000 / 60 / 60 % 24);
        var m = Math.floor(t / 1000 / 60 % 60);
        var s = Math.floor(t / 1000 % 60);
        document.getElementById("t_d").innerHTML = d + " 天";
        document.getElementById("t_h").innerHTML = h + " 时";
        document.getElementById("t_m").innerHTML = m + " 分";
        document.getElementById("t_s").innerHTML = s + " 秒";
    }
    setInterval(getRTime, 1000);
    </script>
</div>
2、把代码粘贴至你认为合适的地方即可

3、保存,前台浏览即可。

免责声明:
1、本站提供的一切软件、教程和内容信息等资源均仅限用于学习和研究目的,不保证其完整性,严禁将上述资源用于商业或者非法用途;
2、本站仅提供共享服务,不提供任何技术咨询服务,请知悉谅解;
3、如果对相关资源比较满意,请前往购买支持正版,得到更好的正版服务;
4、本站信息来自网络公开信息的收集整理,版权争议与本站无关。我们非常重视版权问题,如有侵权请联系我们,我们会第一时间进行处理。
本文链接:https://www.mmeasy.cn/477.html

0
封面图
【严正声明】
1、本站所分享的工具及源代码仅供研究、学习所用,不保证其完整性,若要商用请联系原开发者或开发公司;
2、所有资源切记不能用于一切违法犯罪活动,否则一切法律后果自负,请不要贪图小利走上不归路;
3、本站资源均来自互联网收集或网友分享,若有侵权,请联系站长删除,谢谢。
没有账号? 注册  忘记密码?