本文作者:花雾影

zblog网站底部可动态显示运行时间的 *** 代码推荐

花雾影1年前 ( 2019-11-04 )492721条评论
zblog网站底部可动态显示运行时间的 *** 代码摘要: 在网上看到好多站长朋友们,都喜欢在自己网站的底部加入“本站已运行多少天”的小功能,看着挺有意思,于是今天就在网上搜索了一番此功能的实现方法,然后就在掘金博客找到一段可以动态显示运行...

在网上看到好多站长朋友们,都喜欢在自己网站的底部加入“本站已运行多少天”的小功能,看着挺有意思,于是今天就在网上搜索了一番此功能的实现方法,然后就在掘金博客找到一段可以动态显示运行时间的js代码,在我的博客试了一下非常好用,所以就把这段代码分享出来。有需要就拿去吧。

2019110116373020.jpg zblog网站底部可动态显示运行时间的JS代码 zblog网站底部可动态显示运行时间的 *** 代码 自定义 第1张

<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;}}




文章版权及转载声明

作者:花雾影本文地址:https://www.shuipo.net/blog/15.html发布于 1年前 ( 2019-11-04 )
文章转载或复制请以超链接形式并注明出处水泊网

赞(

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

阅读
分享

发表评论

快捷回复:

评论列表 (有 1 条评论,49272人围观)参与讨论
网友昵称:花雾影
花雾影博主2019-11-09沙发回复Google Chrome 78.0.3904.97Windows 10
赞、狂赞、文章不错,写的很好!