zoukankan      html  css  js  c++  java
  • JS倒计时特效--JavaScript基础

    1、倒计时特效HTML源码

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>倒计时特效</title>
    </head>
    <body>
      <section>
        <div id="CET6"></div>
        <div id="mandarin"></div>
        <div id="Database"></div>
      </section>
    </body>
    <script>
      var nowTime = new Date();
      var setTimeCET6 = new Date("November 25,2017");
      var setTimeMan = new Date("December 16,2017");
      var setTimeDb = new Date("December 9,2017");
      var CET6 = "距离CET6考试只有";
      var Mandarin = "距离普通话考试只有";
      var Db = "距离Access考试只有";
      var dateCET6 = setTimeCET6.getTime() - nowTime.getTime();//date得到的是秒数,单位是ms
      var dateMan = setTimeMan.getTime() - nowTime.getTime();
      var dateDb = setTimeDb.getTime() - nowTime.getTime();
      var timeCet6 = CET6+Math.floor(dateCET6/(1000*60*60*24))+"天!";//最终化为以天为单位;Math.floor()函数四舍五入
      var timeMandarin = Mandarin+Math.floor(dateMan/(1000*60*60*24))+"天!";
      var timeDatabase = Db+Math.floor(dateDb/(1000*60*60*24))+"天!";
      document.getElementById('CET6').innerHTML = timeCet6;
      document.getElementById('mandarin').innerHTML = timeMandarin;
      document.getElementById('Database').innerHTML = timeDatabase;
    </script>
    </html>

    2、效果示例

  • 相关阅读:
    Android平台下基于XMPP的IM研究
    Android File数据存储
    Android 获取屏幕分辨率的方式
    Android TabHost 动态修改图标或者动态改变标题
    Android DatePickerDialog用法
    SharedPreference Demo
    progressdialog 去边框
    [LCT学习时的一些笔记]
    [ZJOI2007]最大半连通子图
    【Matrixtree Theorem学习笔记】
  • 原文地址:https://www.cnblogs.com/qikeyishu/p/7579111.html
Copyright © 2011-2022 走看看