当前位置： 移动技术网 > IT编程>开发语言>JavaScript > js通过Date对象实现倒计时动画效果

js通过Date对象实现倒计时动画效果

2017年12月12日  | 移动技术网IT编程  | 我要评论

js通过date对象实现倒计时效果，具体内容如下

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>倒计时动画</title>
  <style>
    div{
      text-align:center;
      height:100px;
      line-height:100px;
    }
  </style>
  <script>
    window.onload = function(){
      setinterval(freetime,1000);
    }
    function freetime(){
      var curtime = date.now();
      var endtime = new date("2017-10-26 16:00:00");
      var allfreeseconds = (endtime-curtime)/1000;
      if(allfreeseconds>0){
        var freeday = math.floor(allfreeseconds/(24*60*60));
        var freehour = math.floor(allfreeseconds/(60*60) % 24);
        var freeminute = math.floor(allfreeseconds/60 % 60);
        var freesecond = math.floor(allfreeseconds%60);
        document.getelementbyid("nowtime").innerhtml = "剩余"+freeday+"天"+freehour+"时"+freeminute+"分"+freesecond+"秒";
      }
      else{
        document.getelementbyid("nowtime").innerhtml = "已结束";
      }
    }
  </script>
</head>
<body>
<div>
  <span id="nowtime"></span>
</div>
</body>
</html>

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持移动技术网。

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网