900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > javascript毫秒计时器_js实现精确到毫秒的倒计时效果

javascript毫秒计时器_js实现精确到毫秒的倒计时效果

时间:2021-11-30 15:38:47

相关推荐

javascript毫秒计时器_js实现精确到毫秒的倒计时效果

本文实例为大家分享了精确到毫秒的倒计时效果,供大家参考,具体内容如下

div{

width: 100%;

height: 50px;

margin-bottom: 5px;

background: yellowgreen;

}

毫秒的倒计时

var addTimer = function(){

var list = [],

interval;

return function(id,timeStamp){

if(!interval){

interval = setInterval(go,1);

}

list.push({ele:document.getElementById(id),time:timeStamp});

}

function go() {

for (var i = 0; i < list.length; i++) {

list[i].ele.innerHTML = changeTimeStamp(list[i].time);

if (!list[i].time)

list.splice(i--, 1);

}

}

//传入unix时间戳,得到倒计时

function changeTimeStamp(timeStamp){

var distancetime = new Date(timeStamp*1000).getTime() - new Date().getTime();

if(distancetime > 0){

//如果大于0.说明尚未到达截止时间

var ms = Math.floor(distancetime%1000);

var sec = Math.floor(distancetime/1000%60);

var min = Math.floor(distancetime/1000/60%60);

var hour =Math.floor(distancetime/1000/60/60%24);

if(ms<100){

ms = "0"+ ms;

}

if(sec<10){

sec = "0"+ sec;

}

if(min<10){

min = "0"+ min;

}

if(hour<10){

hour = "0"+ hour;

}

return hour + ":" +min + ":" +sec + ":" +ms;

}else{

//若否,就是已经到截止时间了

return "已截止!"

}

}

}();

addTimer("timer1",1451923200);//1月5日00点,unix时间戳自己去百度一下,就有的

addTimer("timer2",1451926800);//1月5日01点

addTimer("timer3",1451930400);//1月5日02点

addTimer("timer4",145400);//1月6日03点

更多关于倒计时的文章请查看专题:《倒计时功能》

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

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。