emlog博客阅读时间特效

教程如下

有的人喜欢有的人不喜欢,一句话:喜欢就看下去,不喜欢就关闭

演示截图

QQ截图20170625033401.png

CSS代码
#tingliu{margin: 30px 0px 15px 0px; padding: 5px 0px 10px 0px; height: 100%; line-height: 2; text-align:center; font-size:14px; background: #f8f8f8; border: 1px dashed #CEB8A3; transition:all 0.2s ease-in-out 0s; -moz-transition:all 0.2s ease-in-out 0s;-webkit-transition:all 0.2s ease-in-out 0s;}
#tingliu:hover{background: #F4F1EF; border: 1px dashed #D9007C; border-radius:0px; -webkit-border-radius:0px; -moz-border-radius:0px;}
.tingliu2{color:#7C4500;} .tingliu3{color: #C03131;} .tingliu4{position:relative; left:0px; top:3px;}
.tingliu5{position:relative; left:0px; top:5px;}

php代码:


                <div id="tingliu"><span class="tingliu2 hint--top hint--bounce" data-hint="希望这篇文章能给你带来收获,去发表评论吧!?">
<img src="http://ww4.sinaimg.cn/large/0060lm7Tgw1f8qy1bokcrg300q00oq2r.gif" class="tingliu5"></span> &nbsp;
<span class="tingliu2">您阅读这篇文章共花了:</span>&nbsp;
<span class="tingliu3" id="stime"></span></div>
<script language="JavaScript">var ss=0,mm=0,hh=0;function TimeGo(){ss++;if(ss>=60){mm+=1;ss=0}if(mm>=60){hh+=1;mm=0}ss_str=(ss<10?"0"+ss:ss);mm_str=(mm<10?"0"+mm:mm);tMsg=""+hh+"小时"+mm_str+"分"+ss_str+"秒";document.getElementById("stime").innerHTML=tMsg;setTimeout("TimeGo()",1000)}TimeGo();</script>
  



发布时间:2019-4-19 20:13 Friday
  • 版权声明:除非注明,文章均为【残月资源网】原创,欢迎转载!转载请注明本文地址,谢谢!

  • 返回列表
    上一篇:
    下一篇:

    发表评论

    填写QQ号自动获取信息
    快捷回复: