<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="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 0px 5px rgb(251, 79, 234), 0px 0px 15px rgb(251, 79, 234), 0px 0px 25px rgb(251, 79, 234), 0px 0px 35px rgb(251, 79, 234), 0px 0px 45px rgb(251, 79, 234), 0px 0px 55px rgb(251, 79, 234), 0px 0px 65px rgb(251, 79, 234);
}
</style>
</head>
<body>
<h1 id="title"></h1>
<script type="text/javascript">
var oH1 = document.querySelector("#title");
oH1.innerHTML = "00天00小时00秒00";
// 原理：获取到需要倒计时的两个日期
// 通过日期获取到距离1970-1-1的毫秒数
// 然后计算差值，处理为计时信息
function kong() {
// 获取现在时间
var now = new Date();
// 获取未来时间
var future = new Date(2016, 7, 6, 7);
// 获取毫秒
var kong = (future.getTime() - now.getTime()) / 1000;
// 86400 = 60 * 60 * 24
var day = parseInt(kong / 86400);
kong = kong % 86400;
var hour = parseInt(kong / 3600);
kong = kong % 3600;
var minute = parseInt(kong / 60);
kong = kong % 60;
var second = 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>
扫一扫
353
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
