倒计时 订阅
倒计时,从未来的某一时点计算时间,用来表示距离某一期限还有多少时间(多含剩余时间越来越少,越来越紧迫的意思)。 展开全文
倒计时,从未来的某一时点计算时间,用来表示距离某一期限还有多少时间(多含剩余时间越来越少,越来越紧迫的意思)。
信息
注    音
ㄉㄠˋ ㄐㄧˋ  ㄕㄧˊ
拼    音
dào jì shí
中文名
倒计时
倒计时来源
“倒计时”这一短语来源于1927年德国的幻想故事片《月球少女》,在这部影片中,导演弗里兹为了增加艺术效果,扣人心弦,在火箭发射的镜头里设计了“9、8、7、……3、2、1”点火的发射程序。这个程序得到火箭专家们的一致赞许,认为它十分准确清楚科学地突出火箭发射的时间越来越少,使人们产生火箭发射前的紧迫感。此后“倒计时”被普遍采用,而且超越了使用范围,成为一个适用性极强,适用范围极广的词语。
收起全文
精华内容
参与话题
问答
  • jquery/js实现一个网页同时调用多个倒计时(最新的)

    万次阅读 多人点赞 2015-11-25 15:24:27
    jquery/js实现一个网页同时调用多个倒计时(最新的) 最近需要网页添加多个倒计时. 查阅网络,基本上都是千遍一律的不好用. 自己按需写了个.希望对大家有用. 有用请赞一个哦! //js //js2 var plugJs={ stamp:0, ...

    jquery/js实现一个网页同时调用多个倒计时(最新的)

    最近需要网页添加多个倒计时. 查阅网络,基本上都是千遍一律的不好用. 自己按需写了个.希望对大家有用. 有用请赞一个哦!

    //js

    //js2
    var plugJs={
        stamp:0,
        tid:1,
        stampnow:Date.parse(new Date())/1000,//统一开始时间戳
        intervalTime:function(){
            if(plugJs.stamp > 0){
                var day = Math.floor(plugJs.stamp / (60 * 60 * 24));
                var hour = Math.floor(plugJs.stamp / (60 * 60)) - (day * 24);
                var minute = Math.floor(plugJs.stamp / 60) - (day * 24 * 60) - (hour * 60);
                var second = Math.floor(plugJs.stamp) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
                
                if (day <= 9) day = '0' + day;
                if (hour <= 9) hour = '0' + hour;
                if (minute <= 9) minute = '0' + minute;
                if (second <= 9) second = '0' + second;
                jQuery('.t_h_'+plugJs.tid).html(hour);
                jQuery('.t_m_'+plugJs.tid).html(minute);
                jQuery('.t_s_'+plugJs.tid).html(second);
                plugJs.stamp--;
                setTimeout('if(typeof(plugJs.intervalTime) == "function"){plugJs.intervalTime();}',1000);
            }
        },
        timer:function (stampend,tid){
            plugJs.stamp = parseInt(stampend)-parseInt(plugJs.stampnow);//剩余时间戳
            plugJs.tid = tid;
            setTimeout('if(typeof(plugJs.intervalTime) == "function"){plugJs.intervalTime();}',1000);
        }
    };
    jQuery(document).ready(function(){
        var stampend = parseInt(jQuery('.countdown_1').attr('data-time'));//灵活读取表里的结束时间戳
        plugJs.timer(stampend,'1');
    });

     


    //html 原文http://blog.csdn.net/websites/article/details/50037611

     

    <div class="time countdown_1" data-time="1449429731">
        <span class="t_h_1">00</span>
        <i class="lay_line">:</i>
        <span class="t_m_1">00</span>
        <i class="lay_line">:</i>
        <span class="t_s_1">00</span>
    </div>
    <div class="time countdown_2" data-time="1449456731">
        <span class="t_h_2">00</span>
        <i class="lay_line">:</i>
        <span class="t_m_2">00</span>
        <i class="lay_line">:</i>
        <span class="t_s_2">00</span>
    
    </div>

     

    注释:setTimeout() 只执行 code 一次。如果要多次调用,请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。

     

     

     

     

     

    展开全文
  • vuejs实现倒计时特效

    万次阅读 2020-06-25 01:20:44
    <div id="app" @click="animate"> <div id="countdown"> <svg :width="size" :height="size"> <circle fill="transparent" :stroke-width="stroke" stroke="#270B58
    <div id="app" @click="animate">
      <div id="countdown">
        <svg
             :width="size"
             :height="size">
          <circle
                  fill="transparent"
                  :stroke-width="stroke"
                  stroke="#270B58"
                  :r="radius"
                  :cx="circleOffset"
                  :cy="circleOffset"></circle>
          <circle
                  class="circle"
                  fill="transparent"
                  :stroke-width="stroke"
                  stroke="#F36F21"
                  :r="radius"
                  :cx="circleOffset"
                  :cy="circleOffset"
                  :stroke-dasharray="circumference"
                  :stroke-dashoffset="progress"
                  stroke-linecap="round"></circle>
        </svg>
        <span>{{ countdown }}</span>
      </div>
    </div>
    
    .circle {
      transform: rotate(-90deg);
      transform-origin: 50% 50%;;
    }
    
    #countdown {
      display: inline-block;
      position: relative;
    }
    
    span {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translateX(-50%) translateY(-50%);
      font-size: 500px;
      font-family: monospace;
      color: #F36F21;
    }
    
    body {
      display: flex;
      justify-content: center;
      align-items: center;
      min-height: 100vh;
      background-color: #43119A;
    }
    
    new Vue({
      el: '#app',
      data: {
        size: 600,
        stroke: 30,
        percentage: 100,
        timer: null,
        seconds: 5,
      },
      computed: {
        radius() {
          return (this.size / 2) - (this.stroke / 2);
        },
        circleOffset() {
          return this.size / 2;
        },
        circumference() {
          return this.radius * 2 * Math.PI;
        },
        progress() {
          return this.circumference - this.circumference * this.percentage / 100;
        },
        countdown() {
          return Math.ceil(this.seconds * this.percentage / 100)
        }
      },
      methods: {
        animate() {
          this.timer = setInterval(() => {
            this.percentage -= 1/10;
    
            if (this.percentage <= 0) {
              clearInterval(this.timer)
              this.percentage = 100;
            }
          }, this.seconds * 1000 / 100 / 10)
        }
      }
    })
    
    展开全文
  • 详细的介绍了如何在PPT中插入倒计时器的方法,并附有详细的截图步骤!!!此文件中包含了倒计时器的.swf文件,成功插入倒计时器的ppt文件,还有详细说明步骤的文档! 在PPT中插入swf,为保证播放时每页PPT都播放插入...
  • 倒计时的时候, 跳转别的页面, 还能继续倒计时, 在倒计时还没结束的时候跳转回原页面, 倒计时的按钮还在继续剩余的倒计时显示, 这种操作怎么实现? 这是我的倒计时Js代码, 应该怎么做? 我用的是bootStrap4 + ...
  • JS 倒计时

    千次阅读 2018-03-24 14:25:06
    本文有3个倒计时功能的Demo:  1.时间戳转换成时间格式倒计时  2.倒计时60秒  3.时间格式的数据直接开始倒计时   直接上代码了: 1.时间戳转换成时间格式倒计时 &lt;text&gt;{{hhh}}:{{mmm}}:{{...

    本文有3个倒计时功能的Demo:

       1.时间戳转换成时间格式倒计时

       2.倒计时60秒

       3.时间格式的数据直接开始倒计时

     

    直接上代码了:

    1.时间戳转换成时间格式倒计时

    <text>{{hhh}}:{{mmm}}:{{sss}}</text>
    Page({
      // 倒计时
      count_down: function (countDown_time) {
        var that = this;
        var time = countDown_time.split(':')
        var hhh = parseInt(time[0])
        var mmm = parseInt(time[1])
        var sss = parseInt(time[2])
        this.setData({
          sss: (sss < 10) ? '0' + sss : sss,
          mmm: (mmm < 10) ? '0' + mmm : mmm,
          hhh: (hhh < 10) ? '0' + hhh : hhh
        })
        var Interval = setInterval(function () {
          if (sss > 0) {
            sss--
          } else {
            if (sss && mmm && hhh == 0) {
              clearInterval(Interval)
              console.log('时间到')
            }
          }
          }
          if (sss == 0) {
            if (mmm > 0) {
              mmm--
              sss = 59;
            }
            if (mmm == 0 && hhh > 0) {
              hhh--
              sss = 59;
              mmm = 59;
            }
          }
          that.setData({
            sss: (sss < 10) ? '0' + sss : sss,
            mmm: (mmm < 10) ? '0' + mmm : mmm,
            hhh: (hhh < 10) ? '0' + hhh : hhh
          })
        }, 1000)
      },
      // 时间戳转换成时分秒
      timestampToTime: function(timestamp) {
        var date = new Date(timestamp);//时间戳为10位需*1000,时间戳为13位的话不需乘1000
        var h = date.getHours() < 10 ? '0' + date.getHours() + ':' : date.getHours() + ':';
        var m = date.getMinutes() < 10 ? '0' + date.getMinutes() + ':' : date.getMinutes() + ':';
        var s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
        return h + m + s;
      },
      onLoad: function (options) {
        var countDown_time = new Date().getTime();
        this.count_down(this.timestampToTime(countDown_time))
      }
    })
    

    2.倒计时60秒:

    <view>{{time}}</view>
    var test_number = 60
    Page({
      count_down: function () {
        var _this = this;
        setInterval(function () {
          test_number--
          if (test_number >= 0) {
            _this.setData({
              time: test_number
            })
          }else{
            console.log('我已经到0了')
          }
        }, 1000)
      },
      onShow: function () {
        this.count_down()
      }
    })

    3.时间格式实现倒计时

    <text>{{hhh}}:{{mmm}}:{{sss}}</text>
    Page({
      onLoad:function(){
        var end_time = '06:22:10';
        this.count_down(end_time);
      },
      // 倒计时
      count_down: function (countDown_time) {
        var that = this;
        var time = countDown_time.split(':')
        var hhh = parseInt(time[0])
        var mmm = parseInt(time[1])
        var sss = parseInt(time[2])
        this.setData({
          sss: (sss < 10) ? '0' + sss : sss,
          mmm: (mmm < 10) ? '0' + mmm : mmm,
          hhh: (hhh < 10) ? '0' + hhh : hhh
        })
        var Interval = setInterval(function () {
          if (sss > 0) {
            sss--
          } else {
            if (sss && mmm && hhh == 0) {
              clearInterval(Interval)
              console.log('时间到')
            }
          }
          }
          if (sss == 0) {
            if (mmm > 0) {
              mmm--
              sss = 59;
            }
            if (mmm == 0 && hhh > 0) {
              hhh--
              sss = 59;
              mmm = 59;
            }
          }
          that.setData({
            sss: (sss < 10) ? '0' + sss : sss,
            mmm: (mmm < 10) ? '0' + mmm : mmm,
            hhh: (hhh < 10) ? '0' + hhh : hhh
          })
        }, 1000)
      }
    })
    

    毫秒转成时分秒倒计时

        count_down(84557095);  
    
    // 倒计时
      count_down: function(countDown_time) {
        var that = this;
        var days = parseInt(countDown_time / (1000 * 60 * 60 * 24));
        var hours = parseInt((countDown_time % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        var minutes = parseInt((countDown_time % (1000 * 60 * 60)) / (1000 * 60));
        var seconds = (countDown_time % (1000 * 60)) / 1000;
        var aaaa = hours + ":" + minutes + ":" + seconds;
        var time = aaaa.split(':')
        var hhh = parseInt(time[0])
        var mmm = parseInt(time[1])
        var sss = parseInt(time[2])
        this.setData({
          sss: (sss < 10) ? '0' + sss : sss,
          mmm: (mmm < 10) ? '0' + mmm : mmm,
          hhh: (hhh < 10) ? '0' + hhh : hhh
        })
        var Interval = setInterval(function() {
            if (sss > 0) {
              sss--
            } else {
              if (sss && mmm && hhh == 0) {
                clearInterval(Interval)
                console.log('时间到')
              }
            }
            if (sss == 0) {
              if (mmm > 0) {
                mmm--
                sss = 59;
              }
              if (mmm == 0 && hhh > 0) {
                hhh--
                sss = 59;
                mmm = 59;
              }
            }
            that.setData({
              sss: (sss < 10) ? '0' + sss : sss,
              mmm: (mmm < 10) ? '0' + mmm : mmm,
              hhh: (hhh < 10) ? '0' + hhh : hhh
            })
          },
          1000)
      },

     

    展开全文
  • js倒计时代码: Javascript代码  js倒计时代码 - k686绿色软件 - http://www.k686.com k686绿色软件 - http://www.k686.com function countDown( maxtime,fn ) { var timer = ...

    js倒计时代码:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
     <head>
      <title>js倒计时代码</title>
      <meta name="Generator" content="EditPlus">
      <meta name="Author" content="k686绿色软件 http://www.k686.com">
      <meta name="Keywords" content="绿色软件">
      <meta name="Description" content="绿色软件">
    
     </head>
    
     <body>
     k686绿色软件 - http://www.k686.com
    <script>
    function countDown( maxtime,fn )
    {    
       var timer = setInterval(function()
       {
    	   if(maxtime>=0){   
    			 minutes = Math.floor(maxtime/60);   
    			 seconds = Math.floor(maxtime%60);   
    			 msg = "距离结束还有"+minutes+"分"+seconds+"秒";   
    			 fn( msg );
    			 if(maxtime == 5*60) alert('注意,还有5分钟!');   
    			 --maxtime;   
    		}   
    		 else{   
    			clearInterval( timer );
    			fn("时间到,结束!");  
    		}   
    	}, 1000);
    }
    </script>
    
    <div id="timer1" style="color:red"></div>
    <div id="timer2" style="color:red"></div>
    
     <script>
    	countDown( 6,function( msg )
    	{
    		document.getElementById('timer1').innerHTML = msg;
    	});
    	
    	countDown( 6000,function( msg )
    	{
    		document.getElementById('timer2').innerHTML = msg;
    	})
     </script>
     </body>
    </html>
    

    忠心感谢来自56484577Q群的wait提供的代码: http://waitdemos.googlecode.com/svn/trunk/tdemos/countDown.html

    此代码的优点在于调用时可不用对功能代码做任何修改.需要显示的地方设定容器id,然后输出一小段代码,一个页面无限制倒计时个数:

    countDown( 6,function( msg )
    {
    	document.getElementById('timer1').innerHTML = msg;
    });

    就可以了.

    下面一段代码是来自同一个交流群的大神Vilic优化简写后的代码,在此一并表示感谢:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns=" http://www.w3.org/1999/xhtml">
    <head>
        <title>Timer - by Vilic JavaScriptQQ交流群56484577</title>
    </head>
    <body>
        <div id="timer1"></div>
        <div id="timer2"></div>
        <div id="timer3"></div>
    </body>
    <script type="text/javascript">
    
        var addTimer = function () {
            var list = [],
                interval;
    
            return function (id, time) {
                if (!interval)
                    interval = setInterval(go, 1000);
                list.push({ ele: document.getElementById(id), time: time });
            }
    
            function go() {
                for (var i = 0; i < list.length; i++) {
                    list[i].ele.innerHTML = getTimerString(list[i].time ? list[i].time -= 1 : 0);
                    if (!list[i].time)
                        list.splice(i--, 1);
                }
            }
    
            function getTimerString(time) {
                var not0 = !!time,
                    d = Math.floor(time / 86400),
                    h = Math.floor((time %= 86400) / 3600),
                    m = Math.floor((time %= 3600) / 60),
                    s = time % 60;
                if (not0)
                    return "还有" + d + "天" + h + "小时" + m + "分" + s + "秒";
                else return "时间到";
            }
        } ();
    
        addTimer("timer1", 12);
        addTimer("timer2", 10);
        addTimer("timer3", 13);
    </script>
    </html>

    转自:http://tuzwu.iteye.com/blog/819081
    展开全文
  • 可输入时间的倒计时程序,用户自己点击菜单输入自己想要的倒计时时间,然后点倒计时开始计时。方便实用,欢迎光临!
  • 一款相当精美的倒计时软件!沪江小D,自己觉得用的不错,分享给有需要的朋友们!
  • 1.activity_main.xml xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main" android:layo
  • iOS中 简单易懂的秒杀倒计时倒计时 商城类APP常用的秒杀倒计时 /iOS倒计时
  • 自定义DigitalClock控件:package ...import java.util.Calendar;import android.content.Context; import android.database.ContentObserver; import android.os.Handler; import android.os.SystemClock
  • 先看效果图!...先看单个倒计时: 代码: <div class="titRight"> <div class="top"> <p>{{detailsListDetails.cate1_name1}}</p> <p>还有{{detailsListDetail...
  • 3.软件提供正计时与倒计时两种功能,可以设置倒计时时间~!在最后10秒会有声音提醒,结束声音提醒!界面可自由拖动! 4.系统采用Flex4开发,供交流学习使用,未经本人允许,请勿传播~! 5.联系方式:qq:471832030 e-...
  • 我之前的想法是用CountDownTimer写了一个给textview倒计时的工具类,然后在activity中调用。但是发现在切换activity再切回来后倒计时就没有了,应该怎么保存这个效果,即使不在这个activity倒计时任然继续。 还有一...
  • js高考倒计时

    千次阅读 2017-05-13 17:33:33
    高考倒计时 距离2017年高考还有天 window.onload = function(){ var timedate= new Date("6,6,2017"); var now = new Date(); var date = timedate.getTime() - now.getTime(); //得出的为毫秒
  • 使用Timer控件做一个倒计时器 可以根据输入的值来控制倒计时的事件。 假设输入的是180s 第一次点开始按钮是 180 179 178 ......正常的 点了重置按钮之后,第二次点开始按钮就是 180 178 176..... 再次重置...
  • html> lang="en"> charset="UTF-8"> 倒计时 class="title_1"> id="text_1" type="text" name="textss" value="查看条款(30)"placeholder="请在这里输入标题"/>
  • flash 倒计时

    热门讨论 2011-01-27 11:04:08
    倒计时器,可以设置时间,始终在窗口前,配合ppt 显示,,有背景音乐,和报警提示音,非常好使
  • 下面说一个ios中常见的大坑。楼主第一次遇到这个问题折腾了很久。第一次做验证码登录。60秒获取一次验证码。分别尝试了NSTimer实现和GCD实现。发现都有问题。...分别是两种方法实现的倒计时: githu
  • 倒计时及重置倒计时

    2015-04-15 16:10:00
    2019独角兽企业重金招聘Python工程师标准>>> ...
  • 一个简单的计时器 提供了一些方法 设置marginpublic void setLinearLayoutMargin(int left, int top, int right, int bottom)public void setTextViewMargin(int left, int top, int right, int bottom)设置...
  • 1、布局用法 引用项目coutdowntimelibrary的CountDownView 如下 android:layout_marginTop="5dp" android:id="@+id/coutdownmillysecond
  • 10之后注册 var leftSeconds = 10;//倒计时时间10秒 var intervalId; $(function () { $("#btn_reg").attr("dis
  • 自定义倒计时控件

    万次阅读 多人点赞 2014-12-17 09:16:41
    就是自定义一个能倒计时的TextView控件,当我们点击start run按钮时,给他传进去一个时间数字,它自己开始倒计时,不需要外部任何干预。当点击Stop run按钮时,停止倒计时。 一、自定义倒计时控件——...
  • 结构 继承关系 public abstract class CountDownTimer extends Object ...定时执行在一段时候后停止的倒计时,在倒计时执行过程中会在固定间隔时间得到通知(译者:触发onTick方法),下面的例
  • 可实现输入XX分XX秒的倒计时,如2分30秒,1分钟,30秒等均可实现
  • 综合作业1:倒计时交通灯 用单片机模拟十字路口的交通灯,采用自动红绿黄交通灯控制,具有固定的红灯、绿灯转换时间间隔,自动切换,每个方向具有倒计时功能。 功能要求: 1)要求南北方向车道和东西方向车道2条...

空空如也

1 2 3 4 5 ... 20
收藏数 25,643
精华内容 10,257
关键字:

倒计时