一、首页倒计时源码

更新代码,无需每年手动更新,自动获取时间计算实现:
<style>
    .gn_box {
        border: none;
        border-radius: 15px;
        padding: 10px 14px;
        margin: 10px;
        margin-bottom: 20px;
        text-align: center;
        background-color: #fff;
    }
    #t_d { color: #982585; font-size: 18px; }
    #t_h { color: #8f79c1; font-size: 18px; }
    #t_m { color: #65b4b5; font-size: 18px; }
    #t_s { color: #83caa3; font-size: 18px; }
    #ld { font-size: 45px; color: #1900E6; }
</style>

<div class="gn_box">
    <center>
        <div id="BigMsg00" class="HotDate11">
            <span id="ld0">
                <font id="currentYear" color=#E80017 size="200">2025</font> 
                <font color=#8C0073 size="200">年</font>  
                <font color=#75008A size="200">-</font>
                <font color=#5E00A1 size="200">已</font>       
                <font color=#4700B8 size="200">经</font>    
                <font color=#3000CF size="200">过</font> 
                <font color=#1900E6 size="200">去</font>
            </span>
            <span id="ld">0</span>
            <font color=#0200FD size="200">天</font>
        </div>
    </center>

    <center>
        <div id="CountMsg" class="HotDate">
            <span>
                <font color=#1900E6 size="4">距离</font>
                <font id="nextYear" color=#1900E6 size="4">2026</font>
                <font color=#1900E6 size="4">年还有:</font>
            </span>
            <span id="t_d">0 天</span>
            <span id="t_h">0 时</span>
            <span id="t_m">0 分</span> 
            <span id="t_s">0 秒</span>
        </div>
    </center>
</div>

<script type="text/javascript">
    var now = new Date();
    var currentYear = now.getFullYear();
    var nextYear = currentYear + 1;

    document.getElementById("currentYear").innerHTML = currentYear;
    document.getElementById("nextYear").innerHTML = nextYear;

    var StartTime = new Date(currentYear + "/01/01 00:00:00");
    var EndTime = new Date(nextYear + "/01/01 00:00:00");

    function getLTime() {
        var NowTime = new Date();
        var t1 = NowTime.getTime() - StartTime.getTime();
        var d1 = Math.floor(t1 / 1000 / 60 / 60 / 24);
        document.getElementById("ld").innerHTML = d1;
    }

    function getRTime() {
        var NowTime = new Date();
        var t = EndTime.getTime() - NowTime.getTime();

        if (t <= 0) {
            document.getElementById("CountMsg").innerHTML = "<font color=#1900E6 size='4'>新年快乐!</font>";
            return;
        }

        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 + " 秒";
    }

    function checkYearUpdate() {
        var now = new Date();
        var currentYear = now.getFullYear();
        var nextYear = currentYear + 1;

        if (document.getElementById("currentYear").innerHTML != currentYear) {
            document.getElementById("currentYear").innerHTML = currentYear;
            document.getElementById("nextYear").innerHTML = nextYear;

            StartTime = new Date(currentYear + "/01/01 00:00:00");
            EndTime = new Date(nextYear + "/01/01 00:00:00");
        }
    }

    getLTime();
    getRTime();
    setInterval(getRTime, 1000);
    setInterval(checkYearUpdate, 1000); 
</script>
修改开始和结束时间年即可
<style> 
    .gn_box{border: none; border-radius: 15px; }
    .gn_box{padding: 10px 14px; margin: 10px; margin-bottom: 20px; text-align: center; background-color: #fff;}
    #t_d{color: #982585; font-size: 18px;}
    #t_h{color: #8f79c1; font-size: 18px;}
    #t_m{color: #65b4b5; font-size: 18px;}
    #t_s{color: #83caa3; font-size: 18px;}
</style>
<div class="gn_box">
    <center>
        <div id="BigMsg00" class="HotDate11">
            <span id="ld0">
                <font color=#E80017 size="200">2</font> 
                <font color=#D1002E size="200">0</font>   
                <font color=#BA0045 size="200">2</font>    
                <font color=#A3005C size="200">4</font>   
                <font  color=#8C0073 size="200">年</font>  
                <font color=#75008A size="200">-</font>
                <font color=#5E00A1 size="200">已</font>       
                <font color=#4700B8 size="200">经</font>    
                <font color=#3000CF size="200">过</font> 
                <font color=#1900E6 size="200">去</font>
            </span>
            <span id="ld" style="font-size: 45px; color:#1900E6">x</span>
            <font color=#0200FD size="200">天</font>
        </div>
    </center> 
    <script type="text/javascript">
        function getLTime(){
            var StartTime = new Date('2024/01/1 00:00:00');               
            var NowTime = new Date();
            var t1 = NowTime.getTime() - StartTime.getTime();
            var d1 = Math.floor(t1 / 1000 / 60 / 60 / 24);
            var leftday = document.getElementById("ld");             
            leftday.innerHTML = d1;
        }
        getLTime();
    </script>
    <center>
        <div id="CountMsg" class="HotDate">
            <span>
                <font color=#1900E6 size="4">距离2025年还有:</font>
            </span>
            <span id="t_d"> 天</span>
            <span id="t_h"> 时</span>
            <span id="t_m"> 分</span> 
            <span id="t_s"> 秒</span>
        </div>
    </center> 
    <script type="text/javascript">         
    function getRTime() {
        var EndTime = new Date('2025/01/1 00:00:00');
        var StartTime = new Date('2024/01/1 00:00:00');               
        var NowTime = new Date();             
        var t = EndTime.getTime() - NowTime.getTime();
        var t1 = NowTime.getTime() - StartTime.getTime();
        var d = Math.floor(t / 1000 / 60 / 60 / 24);
        var d1 = Math.floor(t1 / 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);             
        var day = document.getElementById("t_d");             
        if (day != null) {day.innerHTML = d + " 天";}             
        var hour = document.getElementById("t_h");             
        if (hour != null) {hour.innerHTML = h + " 时";}                 
        var min = document.getElementById("t_m");                 
        if (min != null) {min.innerHTML = m + " 分";}                 
        var sec = document.getElementById("t_s");                 
        if (sec != null) {sec.innerHTML = s + " 秒";}
                      
    }         
    setInterval(getRTime, 1000);
    </script> 
</div>
Last modification:February 9, 2025
If you think my article is useful to you, please feel free to appreciate