高考倒數：最後的一篇技術博文

2018.07.31 4,642 0

伴隨著假期最後一次鬧鐘的響起，意味著這次歷時 19 天的暑假到此結束了，迎面而來的是高三的挑戰。

今天一早我就去了學校看分班情況，6 班，還是普通班，所幸教室位置不錯，對這次分班還是較為滿意的。沒有很多老同學和我同班，意味著我能認識更多的新朋友，這也是挺好的。接下來就是努力備戰的一年了。

話題跑偏了，這是一篇技術博文，主要是想在部落格弄個倒數計時的元件，於是就有了以下程式碼：

HTML

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>高考倒计时</title>
    <script language="javascript" type="text/javascript">
        var interval = 1000;
        function ShowCountDown(year, month, day, divname) {
            var now = new Date();
            var endDate = new Date(year, month - 1, day);
            var leftTime = endDate.getTime() - now.getTime(); // 剩余毫秒
            var leftsecond = parseInt(leftTime / 1000);
            var day1 = Math.floor(leftsecond / (60 * 60 * 24)); // 剩余天
            var hour = Math.floor((leftsecond - day1 * 24 * 60 * 60) / 3600); // 剩余时
            var minute = Math.floor((leftsecond - day1 * 24 * 60 * 60 - hour * 3600) / 60); // 剩余分
            var second = Math.floor(leftsecond - day1 * 24 * 60 * 60 - hour * 3600 - minute * 60); // 剩余秒
            var cc = document.getElementById(divname);
            cc.innerHTML = "距离高考" + year + "年" + month + "月" + day + "日还有：" + day1 + "天" + hour + "小时" + minute + "分" + second + "秒"; // 显示
        }
        window.setInterval(function() {
            ShowCountDown(2019, 6, 7, 'gaokao1');
        }, interval);
    </script>
</head>
<body>
    <div id="gaokao1"></div>
</body>
</html>

其中 ShowCountDown(2019, 6, 7, 'gaokao1'); 就是要計時的終點（也就是這屆高三學子打響第一槍的開始）。

至於怎麼整合到本部落格所使用的 Handsome 主題呢？

開啟 /usr/themes/handsome/component/sidebar.php 檔案。

註解掉第 98 行（不同版本可能行數不一樣）：

PHP

<h3 class="widget-title m-t-none text-md"><?php _me("广告") ?></h3>

反正就是找到以上這一行並註解掉。

然後就是在 设置外观 裡面的 全局右侧边栏广告位 輸入以下 HTML：

HTML

<div class="panel b-a">
    <h4 class="font-thin padder">
        高考倒计时
    </h4>
    <ul class="list-group">
        <li class="list-group-item">
            <script language="javascript" type="text/javascript">
                function ShowCountDown(year, month, day, divname) {
                    var now = new Date();
                    var endDate = new Date(year, month - 1, day);
                    var leftTime = endDate.getTime() - now.getTime(); // 剩余毫秒
                    var leftsecond = parseInt(leftTime / 1000);
                    var day1 = Math.floor(leftsecond / (60 * 60 * 24)); // 剩余天
                    var hour = Math.floor((leftsecond - day1 * 24 * 60 * 60) / 3600); // 剩余时
                    var minute = Math.floor((leftsecond - day1 * 24 * 60 * 60 - hour * 3600) / 60); // 剩余分
                    var second = Math.floor(leftsecond - day1 * 24 * 60 * 60 - hour * 3600 - minute * 60); // 剩余秒
                    var cc = document.getElementById(divname);
                    cc.innerHTML = "距离高考" + year + "年" + month + "月" + day + "日还有：" + day1 + "天" + hour + "小时" + minute + "分" + second + "秒"; // 显示
                }
                window.setInterval(function() {
                    ShowCountDown(2019, 6, 7, 'gaokao1');
                }, interval);
            </script>
            <div id="gaokao1"></div>
        </li>
    </ul>
</div>

大功告成，具體效果看本部落格右側邊欄即可。

題外話

這是 2019.06.09 之前的最後一篇技術博文。從一個小時後開始，我的筆記型電腦就要鎖進櫃子了。在未來的 310 天裡，我將努力克制自己不去接觸學習之外的東西，可能會偶爾寫一下心情，但也會很少了。網路這東西，暫時不去想了...

等我回來吧，當右邊的倒數計時變成 -2天 的時候，說明我已經結束了長達三百多天的特訓。不管到時候考得好不好，總是要付出了努力，才不會去後悔莫及。不管未來何去何從，也要對得起自己踏出的每一步，即使可能會留下些許遺憾，但那不也是自己的經歷嗎？

就在幾天前，將所有的網站都搬家到 DigitalOcean 了，充值 10 刀加上 GitHub 送的 50 刀，使用月付 5 刀的伺服器剛好能用一年，能撐到高考結束之後了。伺服器設定了每月一次的自動快照備份，另外也在寶塔的計劃任務設定了三天一次的全站備份到阿里雲 OSS，保留 120 份，算下來也剛好是一年。如果網站沒有什麼故障的話，應該是能安穩地運行到我考完試，所以，我可以放手了。

很喜歡電視劇《歸去來》裡面的一句話：

歸去來兮，田園將蕪，胡不歸

然後我也學著它給自己寫了一句：

前路遠兮，往後餘生，何不追

在未來的三百多天裡，可能我會失聯了，就這樣吧，我該去學校了，再見。

高考倒數：最後的一篇技術博文

題外話

評論

發佈評論