您的位置:首页 > Web前端 > JavaScript

JS----简单倒计时

2016-01-15 15:08 603 查看
html

<div id="first" style="font-size:50px;">距离2016年春节还有:</div>
<div id="time"></div>

js

<script>
window.onload=function(){
setInterval(changTime, 500);
function changTime(){
document.getElementById("time").innerHTML=getTime();

changeStyle();
}

function gR(){
return Math.floor(Math.random()*16);
}

//设置style:字体大小与颜色
function changeStyle(){
var ele=document.getElementById("time");
var size=Math.random()*40;
ele.style.fontSize=((size+10)+"px");
var mc=new Array("0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F");
ele.style.color="#"+mc[gR()]+mc[gR()]+mc[gR()]+mc[gR()]+mc[gR()]+mc[gR()];
}

//调用时间
function getTime(){
var now=new Date().getTime();
var end=new Date("2016/2/8").getTime();
var temp=end-now;
if(temp<=0){
document.getElementById("first").innerHTML="春节已结束!!!!!";
return "";
}else{
var temp2=new Date();
temp2.setTime(temp);
var sec=Math.floor((temp)/1000%60);
var min=Math.floor(temp/(60*1000)%60);
var hou=Math.floor(temp/(60*60*1000)%24);
var day=Math.floor(temp/(24*60*60*1000));

return day+"天 "+hou+"小时 "+min+"分钟 "+sec+"秒";
}
}
};
</script>

简单效果:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  简单倒计时