在网上看到好多站长朋友们,都喜欢在自己网站的底部加入“本站已运行多少天”的小功能,看着挺有意思,于是今天就在网上搜索了一番此功能的实现方法,然后就在掘金博客找到一段可以动态显示运行时间的js代码,在我的博客试了一下非常好用,所以就把这段代码分享出来。有需要就拿去吧。
<strong> <center> <span id="showsectime"></span> <scrIPt type="text/javaScript"> function NewDate(str) { str = str.split('-'); var date = new Date(); date.setUTCFullYear(str[0], str[1] - 1, str[2]); date.setUTCHours(0, 0, 0, 0); return date; } function showsectime() { var birthDay =NewDate("2019-10-30"); var today=new Date(); var timeold=today.getTime()-birthDay.getTime(); var sectimeold=timeold/1000 var secondsold=Math.floor(sectimeold); var msPerDay=24*60*60*1000; var e_daysold=timeold/msPerDay; var daysold=Math.floor(e_daysold); var e_hrsold=(daysold-e_daysold)*-24; var hrsold=Math.floor(e_hrsold); var e_minsold=(hrsold-e_hrsold)*-60; var minsold=Math.floor((hrsold-e_hrsold)*-60); var seconds=Math.floor((minsold-e_minsold)*-60).toString(); document.getElementById("showsectime").innerHTML = "本站已安全运行:"+daysold+"天"+hrsold+"小时"+minsold+"分"+seconds+"秒"; setTimeout(showsectime, 1000); }showsectime(); </scrIPt> <strong> </center> </strong>
把上面的代码粘贴到主题footer。PHP文件</body>标签前面就可以了,效果见本博客底部,喜欢的朋友赶紧试试吧!
最后贴上我用的可以不停变换颜色的css代码样式,添加到style.CSS文件就可以了,如果是锦鲤主题可以添加到主题设置——首页设置。找到自定义CSS 文本框,粘贴的此处就行了。
#showsectime{animation:change 10s infinite;font-weight:800; }@keyframes change{0%{color:#5cb85c;}25%{color:#556bd8;}50%{color:#e40707;}75%{color:#66e616;}100% {color:#67bd31;}}
发表评论