精华内容
下载资源
问答
  • 本文实例为大家分享了两种倒计时效果,供大家参考,具体内容如下效果图:1.倒计时效果倒计时*{ margin:0; padding:0;}.dtime{ margin:10px;}.dtime span{ color:#C30;}function tbdTimeCountdown(args){//倒计时函数...

    本文实例为大家分享了两种倒计时效果,供大家参考,具体内容如下

    效果图:

    fba7f4c71fe81ba2e5429f0ffc66742e.png

    1.倒计时效果

    倒计时

    *{ margin:0; padding:0;}

    .dtime{ margin:10px;}

    .dtime span{ color:#C30;}

    function tbdTimeCountdown(args){//倒计时函数

    var ele=document.getElementById(args.id);

    var alltime=args.alltime;

    var arr=[];

    var t=Math.floor(alltime/(24*60*60));

    var yt=alltime%(24*60*60);

    var s=Math.floor(yt/(60*60));

    var ys=yt%(60*60);

    var f=Math.floor(ys/(60));

    var yf=ys%(60);

    var m=yf;

    arr[0]=[t,"天"];

    arr[1]=[s,"小时"];

    arr[2]=[f,"分"];

    arr[3]=[m,"秒结束"];

    var s=ce(arr,0);

    ele.innerHTML=s;

    var dong;

    dong=setInterval(function(){

    alltime-=1;

    if(alltime<=0){

    clearInterval(dong);

    ele.innerHTML="0秒";

    args.end();

    }else{

    t=Math.floor(alltime/(24*60*60));

    yt=alltime%(24*60*60);

    s=Math.floor(yt/(60*60));

    ys=yt%(60*60);

    f=Math.floor(ys/(60));

    yf=ys%(60);

    m=yf;

    arr[0]=[t,"天"];

    arr[1]=[s,"小时"];

    arr[2]=[f,"分"];

    arr[3]=[m,"秒结束"];

    var s=ce(arr,0);

    ele.innerHTML=s;

    };

    },1000);

    function ce(arr,sta){

    var i=sta;

    if(i

    if(arr[i][0]!=0){

    var s="";

    for(var j=i;j

    s+=""+arr[j][0]+""+arr[j][1];

    };

    return s;

    }else{

    return ce(arr,i+1);

    };

    };

    };

    };//倒计时end

    //效果1

    //86402 3602 62

    tbdTimeCountdown({id:"a1",//含有倒计时容器

    alltime:3,//倒计时总秒数

    end:function(){//倒计时结束,时间为0是调用的函数

    //alert("倒计时结束才会执行!");

    },

    });

    //效果2

    tbdTimeCountdown({id:"a2",//含有倒计时容器

    alltime:62,//倒计时总秒数

    end:function(){//倒计时结束,时间为0是调用的函数

    },

    });

    //效果3

    tbdTimeCountdown({id:"a3",//含有倒计时容器

    alltime:3602,//倒计时总秒数

    end:function(){//倒计时结束,时间为0是调用的函数

    },

    });

    //效果4

    tbdTimeCountdown({id:"a4",//含有倒计时容器

    alltime:86402,//倒计时总秒数

    end:function(){//倒计时结束,时间为0是调用的函数

    },

    });

    //效果4

    tbdTimeCountdown({id:"a5",//含有倒计时容器

    alltime:154789,//倒计时总秒数

    end:function(){//倒计时结束,时间为0是调用的函数

    },

    });

    2.倒计时2.html

    倒计时

    *{ margin:0; padding:0;}

    .dtime{ margin:10px;}

    .dtime span{ color:#C30;}

    function tbdTimeCountdown(args){//倒计时函数

    var ele=document.getElementById(args.id);

    var alltime=Number(ele.getAttribute(args.alltime));

    var arr=[];

    var t=Math.floor(alltime/(24*60*60));

    var yt=alltime%(24*60*60);

    var s=Math.floor(yt/(60*60));

    var ys=yt%(60*60);

    var f=Math.floor(ys/(60));

    var yf=ys%(60);

    var m=yf;

    arr[0]=[t,"天"];

    arr[1]=[s,"小时"];

    arr[2]=[f,"分"];

    arr[3]=[m,"秒结束"];

    var s=ce(arr,0);

    ele.innerHTML=s;

    var dong;

    dong=setInterval(function(){

    alltime-=1;

    ele.setAttribute(args.alltime,alltime);

    if(alltime<=0){

    clearInterval(dong);

    ele.innerHTML="0秒";

    args.end();

    }else{

    t=Math.floor(alltime/(24*60*60));

    yt=alltime%(24*60*60);

    s=Math.floor(yt/(60*60));

    ys=yt%(60*60);

    f=Math.floor(ys/(60));

    yf=ys%(60);

    m=yf;

    arr[0]=[t,"天"];

    arr[1]=[s,"小时"];

    arr[2]=[f,"分"];

    arr[3]=[m,"秒结束"];

    var s=ce(arr,0);

    ele.innerHTML=s;

    };

    },1000);

    function ce(arr,sta){

    var i=sta;

    if(i

    if(arr[i][0]!=0){

    var s="";

    for(var j=i;j

    s+=""+arr[j][0]+""+arr[j][1];

    };

    return s;

    }else{

    return ce(arr,i+1);

    };

    };

    };

    };//倒计时end

    //效果1

    //86402 3602 62

    tbdTimeCountdown({id:"a1",//含有倒计时容器

    alltime:"alltime",//倒计时总秒数

    end:function(){//倒计时结束,时间为0是调用的函数

    alert("倒计时结束才会执行!");

    },

    });

    //效果2

    tbdTimeCountdown({id:"a2",//含有倒计时容器

    alltime:"alltime",//倒计时总秒数

    end:function(){//倒计时结束,时间为0是调用的函数

    },

    });

    //效果3

    tbdTimeCountdown({id:"a3",//含有倒计时容器

    alltime:"alltime",//倒计时总秒数

    end:function(){//倒计时结束,时间为0是调用的函数

    },

    });

    //效果4

    tbdTimeCountdown({id:"a4",//含有倒计时容器

    alltime:"alltime",//倒计时总秒数

    end:function(){//倒计时结束,时间为0是调用的函数

    },

    });

    //效果4

    tbdTimeCountdown({id:"a5",//含有倒计时容器

    alltime:"alltime",//倒计时总秒数

    end:function(){//倒计时结束,时间为0是调用的函数

    },

    });

    大家可以参考专题 《js倒计时功能汇总》 进行深入学习。

    以上就是本文的全部内容,希望对大家学习JavaScript程序设计有所帮助。

    展开全文
  • Android抢购倒计时,精确天数 小时 分钟 。详细讲解可访问我的博客: http://blog.csdn.net/shr957250701
  • 本文实例为大家分享了Android时分秒倒计时效果的具体代码,供大家参考,具体内容如下从mian.xml下手:xmlns:tools=...

    本文实例为大家分享了Android时分秒倒计时效果的具体代码,供大家参考,具体内容如下

    从mian.xml下手:

    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:gravity="center"

    android:orientation="vertical" >

    android:layout_width="wrap_content"

    android:layout_height="wrap_content"

    android:text="离结束时间为:"/>

    android:layout_width="wrap_content"

    android:layout_height="wrap_content"

    android:layout_gravity="center"

    android:layout_marginTop="10dp"

    android:orientation="horizontal">

    android:id="@+id/tvtime1"

    android:layout_width="wrap_content"

    android:layout_height="wrap_content"

    android:layout_centerHorizontal="true"

    android:layout_centerVertical="true"

    android:gravity="center"

    android:background="#3B3B3B"

    android:text="12"

    android:textColor="#FFFFFF"

    android:textSize="30sp" />

    android:id="@+id/tvtime2"

    android:layout_width="wrap_content"

    android:layout_height="wrap_content"

    android:layout_centerHorizontal="true"

    android:layout_centerVertical="true"

    android:layout_marginLeft="10dp"

    android:gravity="center"

    android:text="12"

    android:textColor="#FFFFFF"

    android:background="#3B3B3B"

    android:textSize="30sp" />

    android:id="@+id/tvtime3"

    android:layout_width="wrap_content"

    android:layout_height="wrap_content"

    android:layout_centerHorizontal="true"

    android:layout_centerVertical="true"

    android:layout_marginLeft="10dp"

    android:gravity="center"

    android:background="#3B3B3B"

    android:textColor="#FFFFFF"

    android:text="13"

    android:textSize="30sp" />

    MainActivity

    public class MainActivity extends Activity {

    private TextView tvtime1,tvtime2,tvtime3;

    private long time=400;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

    super.onCreate(savedInstanceState);

    setContentView(R.layout.activity_main);

    tvtime1=(TextView)findViewById(R.id.tvtime1);

    tvtime2=(TextView) findViewById(R.id.tvtime2);

    tvtime3=(TextView) findViewById(R.id.tvtime3);

    handler.postDelayed(runnable, 1000);

    }

    Handler handler = new Handler();

    Runnable runnable = new Runnable() {

    @Override

    public void run() {

    time--;

    String formatLongToTimeStr = formatLongToTimeStr(time);

    String[] split = formatLongToTimeStr.split(":");

    for (int i = 0; i < split.length; i++) {

    if(i==0){

    tvtime1.setText(split[0]+"小时");

    }

    if(i==1){

    tvtime2.setText(split[1]+"分钟");

    }

    if(i==2){

    tvtime3.setText(split[2]+"秒");

    }

    }

    if(time>0){

    handler.postDelayed(this, 1000);

    }

    }

    };

    public String formatLongToTimeStr(Long l) {

    int hour = 0;

    int minute = 0;

    int second = 0;

    second = l.intValue() ;

    if (second > 60) {

    minute = second / 60; //取整

    second = second % 60; //取余

    }

    if (minute > 60) {

    hour = minute / 60;

    minute = minute % 60;

    }

    String strtime = hour+":"+minute+":"+second;

    return strtime;

    }

    }

    效果图:

    361f9c0e8b9a5082f0421d7784509ee3.png

    以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

    展开全文
  • js实现时分秒倒计时

    2021-01-19 21:05:07
    本文实例为大家分享了js实现时分秒倒计时具体代码,供大家参考,具体内容如下 <!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8> <title>js时分秒毫秒倒计时</title&...
  • 本文实例为大家分享了两种倒计时效果,供大家参考,具体内容如下 效果图: 1.倒计时效果 <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>倒计时</title> &...
  • 本文实例为大家分享了Android时分秒倒计时效果的具体代码,供大家参考,具体内容如下 从mian.xml下手: <LinearLayout xmlns:android=http://schemas.android.com/apk/res/android xmlns:tools=...
  • 本文实例为大家分享了JS时分秒倒计时的实现的具体代码,供大家参考,具体内容如下js简单时分秒倒计时function countTime() {//获取当前时间var date = new Date();var now = date.getTime();//设置截止时间var ...

    本文实例为大家分享了JS时分秒倒计时的实现的具体代码,供大家参考,具体内容如下

    js简单时分秒倒计时

    function countTime() {

    //获取当前时间

    var date = new Date();

    var now = date.getTime();

    //设置截止时间

    var endDate = new Date("2016-10-22 23:23:23");

    var end = endDate.getTime();

    //时间差

    var leftTime = end-now;

    //定义变量 d,h,m,s保存倒计时的时间

    var d,h,m,s;

    if (leftTime>=0) {

    d = Math.floor(leftTime/1000/60/60/24);

    h = Math.floor(leftTime/1000/60/60%24);

    m = Math.floor(leftTime/1000/60%60);

    s = Math.floor(leftTime/1000%60);

    }

    //将倒计时赋值到div中

    document.getElementById("_d").innerHTML = d+"天";

    document.getElementById("_h").innerHTML = h+"时";

    document.getElementById("_m").innerHTML = m+"分";

    document.getElementById("_s").innerHTML = s+"秒";

    //递归每秒调用countTime方法,显示动态时间效果

    setTimeout(countTime,1000);

    }

    00

    00

    00

    00

    代码总结:

    Math.floor:返回小于等于参数的最大整数

    setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式

    以上所述是小编给大家介绍的JS时分秒倒计时的实现详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

    展开全文
  • 分享给大家供大家参考,具体如下:js-手机发送短信倒计时button{width: 100px;height: 30px;border: none;}input{outline: none;}window.onload = function(){function $(id){ return document.getElementById(i...

    本文实例讲述了js实现倒计时重新发送短信验证码功能的方法。分享给大家供大家参考,具体如下:

    js-手机发送短信倒计时

    button{

    width: 100px;

    height: 30px;

    border: none;

    }

    input{

    outline: none;

    }

    window.onload = function(){

    function $(id){ return document.getElementById(id); }

    $('btn').onclick = function(){

    clearInterval(timer); //清除计时器

    var that = this;

    that.disabled = true;

    var count = 5;

    var timer = setInterval(function(){

    if(count>0){

    count--;

    that.innerHTML = "剩余时间"+ count +"s";

    }else{

    that.innerHTML ="重新发送短信";

    that.disabled = false;

    clearInterval(timer); //清除计时器

    }

    },1000);

    }

    }

    点击发送短信

    或者使用setTimeout来模拟,一般情况下,还是推荐使用setTimeout,更安全一些。当使用setInterval(fn,1000)时,程序是间隔1s执行一次,但是每次程序执行是需要3s,那么就要等程序执行完才能执行下一次,即实际间隔时间为(间隔时间和程序执行时间两者的最大值)。而setTimeout(fn,1000),代表的是,延迟1s再执行程序,且仅执行一次。每次程序执行是需要3s,所以实际时间为 1s+3s=4s。可以使用setTimeout递归调用来模拟setInterval。

    window.onload = function(){

    function $(id){ return document.getElementById(id); }

    $('btn').onclick = function(){

    var that = this;

    that.disabled = true;

    var count = 5;

    var timer = setTimeout(fn,1000);

    function fn(){

    count--;

    if(count>0){

    that.innerHTML = "剩余时间"+ count +"s";

    setTimeout(fn,1000);

    }else{

    that.innerHTML ="重新发送短信";

    that.disabled = false;

    }

    }

    }

    }

    以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。 ad51e517755f8fd6a7ec83ced4ecfaf3.png

    展开全文
  • 主要介绍了JavaScript输入分钟、秒倒计时的代码实现,通过css和js代码展示了逻辑过程,具体操作步骤大家可查看下文的详细讲解,感兴趣的小伙伴们可以参考一下。
  • 本文实例为大家分享了vue验证码倒计时60具体代码,供大家参考,具体内容如下 html 获取验证码 !show class=count>{{count}} s js data(){ return { show: true, count: '', timer: null, } }, methods...
  • proteus单片机实现60秒倒计时器 项目要实现的60s秒表倒计时器,用 AT89C51单片机的定时 / 计数器 T0 产生一秒的定时时间,实现 59 0秒的循环显示的功能。具体要求: 1)按下启动按键后,倒计时器开始工作,从60S...
  • 本文为大家分享用vhdl语言编写的9秒倒计时器程序。 VHDL语言优势 (1)与其他的硬件描述语言相比,VHDL具有更强的行为描述能力,从而决定了他成为系统设计领域最佳的硬件描述语言。强大的行为描述能力是避开具体的...
  • 本文实例讲述了js实现倒计时重新发送短信验证码功能的方法。分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js-手机发送...
  • 本文实例为大家分享了js实现5秒倒计时并跳转功能的具体代码,供大家参考,具体内容如下 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>倒计时五秒</title> ...
  • 本文给大家分享一段js代码关于实现验证码功能并在60倒计时功能。废话不多说了,具体代码如下所示: <!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; ...
  • 本文实例为大家分享了JS时分秒倒计时的实现的具体代码,供大家参考,具体内容如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js简单时分秒倒计时<...
  • 用Verilog实现60秒倒计时时钟

    万次阅读 热门讨论 2019-02-26 20:27:20
    因为使用zybo板自带的时钟信号,频率约为100000000hz,若想实现每秒计时一次,首先利用分频器将时钟频率分频成1hz的信号,每当这个1hz的输入信号改变时计时器自增1,计时器最大值为59,计时器输出的2进制信号再转换...
  • Android 实现图片的时分秒倒计时
  • JS实现倒计时跳转后新页面

    万次阅读 2016-11-05 09:26:23
    同时为了使页面更加美化,我们往往会加上倒计时跳转功能,也就是使网页上的秒杀呈现倒数显示。下面就是具体的实现过程。 1、添加mate  这个mate的功能就是实现跳转,content中的内容3就是三后跳转,...
  • 使用js实现几以后倒计时跳转,这个在某些特殊情况下还是比较实用的,下面为大家介绍下具体的实现步骤,感兴趣的朋友不要错过
  • 用js判断60秒到计时,首先定义一个变量refreshTime,当触发事件的时候检查一下上一次请求成功的时间距离现在是否超过60,如果没有超过60,则弹出提示, 否则则允许继续请求,请求成功之后,把当前的时间赋值给...
  • html 10 倒计时 (已实现)

    千次阅读 2016-09-29 10:40:06
    script 的倒计时参考内容 1、可以直接以提示框的形式输出 alert("输出的内容"); 2、可以输出网页的某个位置 1、在显示输出的位置放一个标签 2、根据id获取标签a:var out=document.getElementById('out'); ...
  • 页面中需要实现某个按钮点击完后,禁用它,并显示倒计时。这个默认是3,代码如下
  • 单片机应用技术课程设计指导书合肥通用职业技术学院电气与计算机系 二OO九年11月单片机应用是一门很重要的专业课,它涉及的理论... 设计题目 99秒倒计时的设计 二. 总体要求1. 仔细阅读设计任务,根据设计的任务...
  • 使用android提供的android.os包中的counterDownTimer可以很方便的实现倒计时功能,具体如下: import android.os.CountDownTimer; public class Couterdown extends CountDownTimer { public Couterdown...
  • vue实现验证码倒计时60具体代码 <span v-show="show" @click="getCode">获取验证码</span> <span v-show="!show" class="count">{{count}} s</span> data(){ return { show:...
  • 背景技术:倒计时器是由单片机为核心的器件组成的一个倒计时系统,系统显示器是由7位数字型数码管组成,分别显示时间值的分、和0.1,它能够通过小键盘阵列设定倒计时时间,当倒计时到,有蜂鸣器发出警报。...
  • &lt;template&gt; &lt;span v-show="show" @click="getCode"&gt;获取验证码&lt;/span&gt; &lt;span v-show="!show" class="...
  • 欢迎来到我的博客 不废话,直接上代码,代码虽然简单,能给读者带来点丝毫的便利也是好的。 <... <head lang="en"> <meta charset="UTF-8">...倒计时实现</title> <style> .ddd{ width:...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 9,016
精华内容 3,606
关键字:

具体到秒的倒计时