您的位置:首页 - Javascript
JavaScript的圣诞倒计时数字钟
查看效果:http://keleyi.com/keleyi/phtml/jstexiao/18.htm

以下是代码:
<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JavaScript的圣诞倒计时数字钟-柯乐义</title>
<style type="text/css" media="all">
#keleyi {
font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;
font-size: 19px;
font-weight: bold;
color: #164BA0;
background-color: #D1D1D1;
border: 1px solid #83AAD3;
width: 400px;
text-align: center;
}

#keleyi span {
font-size: 80%;
}
</style>

</head>

<body>

<div id="keleyi">Christmas Countdown</div>
<br /><a href="http://keleyi.com" title="Back to article - JavaScript Christmas Countdown Digital Clock">原文</a>

<script type="text/javascript">

function iCounter() {
var keleyi=(new Date().getMonth()>=11 && new Date().getDate()>25)? (new Date().getFullYear())+1 : new Date().getFullYear();
var cDateTime=new Date();
var tDateTime=new Date("December 25, "+keleyi+" 0:0:00");
//var tDateTime=new Date("June 11, "+keleyi+" 0:0:00");
var timeDiff=(tDateTime-cDateTime)/1000; //difference btw target date and current date, in seconds
var oneMin=60; //1 minute in seconds
var oneHour=60*60; //1 hour in seconds
var oneDay=60*60*24; //1 day in seconds
var totalDay=Math.floor(timeDiff/oneDay);
var totalHour=Math.floor((timeDiff-totalDay*oneDay)/oneHour);
var totalMin=Math.floor((timeDiff-totalDay*oneDay-totalHour*oneHour)/oneMin);
var totalSec=Math.floor((timeDiff-totalDay*oneDay-totalHour*oneHour-totalMin*oneMin));
//Disply Christmas Countdown to Web Browser
document.getElementById("kel" + "eyi").innerHTML = '距离圣诞节还有<br />' + totalDay + ' <span>天,</span> ' + totalHour + ' <span>时,</span> '
+ totalMin + ' <span>分,</span> ' + totalSec + ' <span>秒,</span>';
setTimeout("iCounter()",1000);
}

iCounter();

</script>
<br />


<div>
<p>来源:<a href="http://keleyi.com/a/bjad/b1lipq9t.htm">原文</a> <a href="http://keleyi.com/a/bjad/3s0khhpt.htm">同类效果</a> <a href="http://keleyi.com">首页</a> <a href="http://keleyi.com/keleyi/phtml/">特效库</a> <a href="http://keleyi.com/a/bjac/iqiiedy2.htm">圣诞快乐</a></p>
</div>
<!-- END: Powered by keleyi.com -->

</body>
</html>
本站导航
相关文章
柯乐义 Copyright© keleyi.com