js倒计时，距离某个时间的倒计时。

说到倒计时，是不是也就只会写获取验证码60s倒计时，在往上是不是脑力感觉不够用，身体好像被掏空了。直接看代码，让你好代码也好。

1、

<!Doctype html>
<html>
<head>
<meta charset="utf-8">
<title>倒计时</title>
<script type="text/javascript">function GetRTime(){var EndTime= new Date('2017/08/12 16:00:00'); //截止时间 var NowTime = new Date();var t =EndTime.getTime() - NowTime.getTime();var d=Math.floor(t/1000/60/60/24);var h=Math.floor(t/1000/60/60%24);var m=Math.floor(t/1000/60%60);var s=Math.floor(t/1000%60);document.getElementById("t_d").innerHTML = d + "天";document.getElementById("t_h").innerHTML = h + "时";document.getElementById("t_m").innerHTML = m + "分";document.getElementById("t_s").innerHTML = s + "秒";}setInterval(GetRTime,1000);
</script>
</head>
<body><div id="CountMsg" class=HotDate><span id="t_d"></span><span id="t_h"></span><span id="t_m"></span><span id="t_s"></span></div></body>
</html>

　　简单点的倒计时出来了

、来写一个这样的

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>倒计时</title>
<style type="text/css">
*{font-style: normal;
}.time{display: inline-block;margin-left: 20px;/*padding-top: 6px;*/
}
.time i{background-color: #333;display: inline-block;width: 20px;height: 20px;margin-left: 3px;color: #fff;border-radius: 2px;text-align: center;line-height: 20px;
}
</style>
</head>
<body><div class="time" ectype="time"><span>本场还剩   </span><span class="hours"></span><em>:</em><span class="minutes"></span><em>:</em><span class="seconds"></span></div> </body>
<script src="http://huo1.wordhuo.com/js/jquery-1.9.1.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">timeFun();function timeFun(){var data="";var TIMER;data=2017;reflash();function reflash(){data--;var d=parseInt(data/60/60/24);var h=parseInt(data/60/60%24);var m=parseInt(data/60%60);var s=parseInt(data%60);$(".time").find(".days").html(nol(d));$(".time").find(".hours").html(nol(h));$(".time").find(".minutes").html(nol(m));$(".time").find(".seconds").html(nol(s));};TIMER = setInterval( reflash,1000 );function nol(h){if(h<0){h='<i>0</i>'+'<i>0</i>';}else if(h<10){h='<i>0</i>'+'<i>'+h+'</i>';}else{var sty=h.toString()h='<i>'+sty.charAt(0)+'</i>'+'<i>'+sty.charAt(1)+'</i>'}return h;}}
</script>
</html>

转载于:https://www.cnblogs.com/zshno1/p/6913903.html

js倒计时，距离某个时间的倒计时。相关推荐

js 时间戳与时间格式的转化, xx天xx小时xx分倒计时,距离当前时间多久
目录一.时间戳和日期格式相互转化 (1) 获取时间戳 (2) 时间戳转化为日期格式 (3) 日期格式转换为时间戳二. XX天XX小时XX分倒计时三.距离当前时间的计算, 显示效果为3秒前,1小时 ...
[js倒计时]指定对应时间自动倒计时
距离周一 8:30 剩下 xx:xx:xx 定时器利用js设置一个时间倒计时标识牌,设计原理:将指定时间减掉当前时间,获得时间差,在利用数学方法分别获取指定的时.分.秒:使用定时器指定时间自动刷新. ...
js 获取距离某个时间过去了多少年，天，月，等
/*** 根据指定的t,获取t距离现在过去了多少天* @param t 指定的时间* @return {any} elapsed 过去的时间*/function getElapsedTime(t) { ...
js 倒计时写法（三种：倒计时发送，倒计时时间，倒计时可用）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
HTML+CSS+svg绘制精美彩色闪灯圣诞树，HTML+CSS+Js实时新年时间倒数倒计时(附源代码)
HTML+CSS+svg绘制精美彩色闪灯圣诞树, HTML+CSS+Js实时新年时间倒数倒计时(附源代码) 本篇目录一.前言二.主要功能三.效果展示四.编码实现步骤五.资源下载六.完整源代 ...
关于前端在vue中实现‘距离某个时间点的倒计时’问题：设置了间隔计算时间，刚开始有停顿。
//函数接受一个结束时间,单位为毫秒,算出当前距离结束时间点的时间,输出一个对象 //输出示例:{ // hourNum: '12', // minuteNum: '13', // secondNum ...
js根据当前时间和结束时间做倒计时（还有XXX天XXX时XXX分XXX秒）
js根据当前时间和结束时间做倒计时(还有XXX天XXX时XXX分XXX秒),当天,不需要XXX天数,剩余0小时,不需要显示XXX时,剩余0分钟,不需要显示XXX分 1. js方法 2. HTML代码 ...
JavaScript 逼真图片倒计时实现代码 js时间图片倒计时
JavaScript 逼真图片倒计时实现代码 js时间图片倒计时效果图: <!doctype html> <html> <head> <meta cha ...
JavaScript 实现页面内时间实时倒计时计时器内附完整文件欢迎调用(可用于抢购倒计时,记录恋爱纪念日总时长等)输出对应的天数小时分钟秒数
JavaScript 实现页面内时间倒计时计时器可用于抢购倒计时,记录恋爱纪念日总时长等输出对应的天数小时分钟秒数注意:在下一个文章中将公布一个纪念日成品代码,欢迎各位来学习(复制) 第一步:构 ...

js倒计时，距离某个时间的倒计时。

js倒计时，距离某个时间的倒计时。相关推荐

最新文章

热门文章