11
2022
11

网页倒计时代码,到时间后显示结束!

简单js倒计时代码,到时间后显示已经结束!



  1. <!DOCTYPE html>

  2. <html>

  3.     <head>

  4.         <meta charset="utf-8">

  5.         <title></title>

  6.         <style type="text/css">

  7.             .HotDate{height: 50px;width: 250px;margin: 2px auto;background: #666666;

  8.             }

  9.             .HotDate span{display: inline-block;padding: 4px;background: #fff;color: #000;font-size: 16px;}

  10.         </style>

  11.     </head>

  12. <DIV id="CountMsg" class="HotDate">

  13.     <span id="t_d">00</span>天

  14.     <span id="t_h">00</span>时

  15.     <span id="t_m">00</span>分

  16.     <span id="t_s">00</span>秒

  17. </DIV>

  18. <script type="text/javascript">

  19.  

  20.     function getRTime(){

  21.         var EndTime= new Date('2015/11/21 10:30:00');

  22.         var NowTime = new Date();

  23.         var t =EndTime.getTime() - NowTime.getTime();

  24.         if(t < 0){

  25.          clearInterval(time1);

  26.          document.getElementById("CountMsg").innerHTML = "活动已经结束";

  27.         }{

  28.          var d=Math.floor(t/1000/60/60/24);

  29.          var h=Math.floor(t/1000/60/60%24);

  30.          var m=Math.floor(t/1000/60%60);

  31.          var s=Math.floor(t/1000%60);

  32.          document.getElementById("t_d").innerHTML = (d<10?'0':'') +d ;

  33.          document.getElementById("t_h").innerHTML = (h<10?'0':'') +h ;

  34.          document.getElementById("t_m").innerHTML = (m<10?'0':'') +m ;

  35.          document.getElementById("t_s").innerHTML = (s<10?'0':'') +s ;

  36.         }

  37.     }

  38.     var time1 = setInterval(getRTime,1000);

  39.    

  40. </script>

  41.     </body>

  42. </html>

« 上一篇 下一篇 »

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。