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>
简单效果:
<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>
简单效果:
相关文章推荐
- js 类型检测
- 本人的开发中的一些笔记(一)js判断页面中多个checkbox是否至少被选中一个
- 周记(jsp中Icon引用的bug)
- JS操作json简单示例
- 关于JavaScript相关文章
- JavaScript时间操作之年月日星期级联操作
- 正确配置jstl的maven依赖,jar包冲突的问题终于解决啦
- JavaScript String 对象实例深入研究
- JS控制生成缩略图
- javascript数组操作大全,数组方法总汇
- java和javascript中this区别的浅探讨
- js播放wav格式的录音文件
- 截取中文字符串的js方法
- 读《编写可维护的JavaScript》第七章总结
- js-Event构造函数,也许你需要
- 提交json串格式的POST请求
- JS中完美兼容各大浏览器的scrolltop方法
- Extjs提交form表单的方式
- Extjs 控件属性(部分)
- JS判断是否已经到达页面底部