倒计时

来源:互联网 发布:淘宝小号哪里买 编辑:程序博客网 时间:2024/06/05 23:57

<!DOCTYPE html>

<html>


<head>

<metacharset="UTF-8">

<title></title>

<styletype="text/css">

html{

height:500px;

background-color: black;

padding-top:300px;

text-align: center;

background:url(img/love.jpg)no-repeat ;

background-size:100% 100%;

}

#title{

color: white;

font-size:60px;

text-shadow:0px 0px5px rgb(251,79, 234),0px 0px15px rgb(251,79, 234),0px 0px25px rgb(251,79, 234),0px 0px35px rgb(251,79, 234),0px 0px45px rgb(251,79, 234),0px 0px55px rgb(251,79, 234), 0px 0px 65px rgb(251, 79, 234);

}

</style>

</head>


<body>

<h1id="title"></h1>

<scripttype="text/javascript">

varoH1 = document.querySelector("#title");

oH1.innerHTML = "00天00小时00秒00";

// 原理:获取到需要倒计时的两个日期

// 通过日期获取到距离1970-1-1的毫秒数

// 然后计算差值,处理为计时信息

functionkong() {

// 获取现在时间

varnow = new Date();

// 获取未来时间

varfuture = new Date(2016, 7, 6, 7);

// 获取毫秒

varkong = (future.getTime() - now.getTime()) / 1000;

// 86400 = 60 * 60 * 24

varday = parseInt(kong / 86400);

kong = kong % 86400;

varhour = parseInt(kong / 3600);

kong = kong % 3600;

varminute = parseInt(kong / 60);

kong = kong % 60;

varsecond = parseInt(kong);

if(second < 10) {

second= "0" +second;

}

if(minute < 10) {

minute= "0" +minute;

}

oH1.innerHTML = "距离里约奥运会还有:" +day + "天"+ hour + "小时"+ minute + "分"+ second + "秒";

}

kong();

setInterval(function() {

kong();

}, 1000);

</script>

</body>


</html>

0 0