TypechoJoeTheme

老狮的梦

统计
登录
用户名
密码
/
注册
用户名
邮箱
输入密码
确认密码
文章目录

精确到微秒的倒计时

老狮博主
2019-08-05
/
8 评论
/
2,494 阅读
/
221 个字
/
百度已收录
08/05
本文最后更新于2020年01月19日,已超过893天没有更新。如果文章内容或图片资源失效,请留言反馈,我会及时处理,谢谢!

倒计时器在生活中是个家居小助手,煲汤的时候使用会提醒不会在盯着时间,怕忘记了。对于习惯晚上敷面膜却又怕会中敷面膜中睡着,倒计时器对于有严重性的拖延症是一个很有效果的,可以时时刻刻提醒着你。在生活中还有很多的用处,智能家居生活现已经离不开计时器了。
倒计时器种类很多,有创意时尚环保的,也有小巧玲珑外观精美的,厨房使用倒计时器,定时每分每秒提醒你不要忘记烹饪时间,满足生活的不同需求,做到休息,监督孩子作业两不误。

效果:

距离2019年七夕节还有:小时微秒

方法

<div id="time_conter">距离2019年七夕节还有:<span id="h"></span>小时<span id="m"></span>分<span id="s"></span>秒<span id="ms"></span>微秒</div>
<script language="javascript"> 
function n2(n){
    if(n < 10)return "0" + n.toString();
    return n.toString();
}
function n3(n){
    if(n < 10)return "00" + n.toString();
    if(n < 100)return "0" + n.toString();
    return n.toString();
}
function setLeft(){
    var d1 = new Date();
    var n;
    n = (d.getTime() - d1.getTime());
    document.getElementById("ms").innerHTML = n3(n % 1000);
    n = (n - n % 1000) / 1000;
    document.getElementById("s").innerHTML = n2(n % 60);
    n = (n - n % 60) / 60;
    document.getElementById("m").innerHTML = n2(n % 60);
    n = (n - n % 60) / 60;
    document.getElementById("h").innerHTML = n2(n);
    setTimeout("setLeft();", 1);
}
var a, a1, a2;
a = unescape("2019-8-7 00:00:00").split(" ");
if(a.length > 1){
    document.getElementById("time_conter").style.display="";
    a1 = a[0].split("-");
    a2 = a[1].split(":");
    var d = new Date(a1[0], a1[1] - 1, a1[2], a2[0], a2[1]);
    setLeft();
}
</script>
美化代码网络
朗读
赞(2)
赞赏
感谢您的支持,我会继续努力哒!
版权属于:

老狮的梦

本文链接:

https://laolion.com/archives/1176.html(转载时请注明本文出处及文章链接)

评论 (8)
  1. 24567 闲逛
    Android Pie · QQ Browser

    对了,博主我想在一个页面添加多个倒计时,该怎么操作呢(两三个左右)

    2022-02-24 回复
    1. 老狮 博主
      Android · QQ Browser
      @24567

      那就放三个倒计时代码,并分别在每个倒计时代码收尾加!!!

      2022-02-24 回复
  2. 2456 闲逛
    Android · Google Chrome

    我会了,感谢博主

    2022-02-24 回复
  3. 2456 闲逛
    Windows 10 · Google Chrome

    请问如何把效果显示在单独的一篇文章中,我试了一下,不会弄

    2022-02-23 回复
    1. 老狮 博主
      Android · QQ Browser
      @2456

      在代码的收尾各加!!!

      2022-02-23 回复
      1. 2456 闲逛
        Android · Google Chrome
        @老狮

        博主你好,请问这代码是放在什么位置的,哪个文件中

        2022-02-24 回复
  4. 程志辉 闲逛
    Windows 10 · Google Chrome

    哈哈,我买了一个实体的计时器,用来记录每天学习了多久,每个阶段用时多久http://study.qqzmly.com/usr/uploads/2019/08/890714744.jpg

    2019-08-07 回复
    1. 老狮 博主
      Android · Google Chrome
      @程志辉

      我也买了一个,不过不是用来学习,而是炸东西时用的嘿嘿

      2019-08-07 回复

互动读者

  • 八九闲逛

    评论 5 次 | 文章 0 篇

  • 老狮博主

    评论 5 次 | 文章 335 篇

  • aihe闲逛

    评论 3 次 | 文章 0 篇

  • 秋天笔记闲逛

    评论 3 次 | 文章 0 篇

标签云