大周哥 » 查看日志 » 网页倒计时代码
网页倒计时代码
时间:2015-4-1 21:44 Wednesday | 作者:大周哥 | 分类:技术文档

 效果如图所示:

点击查看原图

如果你学过CSS代码,也可以把它改得好看些,就像这样:

点击查看原图

下面是完整代码,复制到一个新建文本文档中,将后缀更名为html即可:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
<script language="JavaScript">
<!-- hide script from old browser
var DifferenceHour = -1
var DifferenceMinute = -1
var DifferenceSecond = -1
var Tday = new Date("June 7, 2014 00:00:00") //**倒计时时间点-注意格式
var daysms = 24 * 60 * 60 * 1000
var hoursms = 60 * 60 * 1000
var Secondms = 60 * 1000
var microsecond = 1000
function clock()
{
var time = new Date()
var hour = time.getHours()
var minute = time.getMinutes()
var second = time.getSeconds()
var timevalue = ""+((hour > 12) ? hour-12:hour)
timevalue +=((minute < 10) ? ":0":":")+minute
timevalue +=((second < 10) ? ":0":":")+second
timevalue +=((hour >12 ) ? " PM":" AM")
// document.formnow.now.value = timevalue
var convertHour = DifferenceHour
var convertMinute = DifferenceMinute
var convertSecond = DifferenceSecond
var Diffms = Tday.getTime() - time.getTime()
DifferenceHour = Math.floor(Diffms / daysms)
Diffms -= DifferenceHour * daysms
DifferenceMinute = Math.floor(Diffms / hoursms)
Diffms -= DifferenceMinute * hoursms
DifferenceSecond = Math.floor(Diffms / Secondms)
Diffms -= DifferenceSecond * Secondms
var dSecs = Math.floor(Diffms / microsecond)
if(convertHour != DifferenceHour) document.formnow.dd.value=DifferenceHour
if(convertMinute != DifferenceMinute) document.formnow.hh.value=DifferenceMinute
if(convertSecond != DifferenceSecond) document.formnow.mm.value=DifferenceSecond
document.formnow.ss.value=dSecs
// document.formnow.Tnow.value= DifferenceHour DifferenceMinute + DifferenceSecond + dSecs
setTimeout("clock()",1000)
}
// end hiding -->
</script>
</head>

<body onload="clock();return true">

距北京奥运还有:<br>
<form name="formnow">
<input name="dd" type="text" style="border:0;" size="2"> 天
<input name="hh" type="text" style="border:0;" size="2"> 小时
<input name="mm" type="text" style="border:0;" size="2"> 分
<input name="ss" type="text" style="border:0;" size="2"> 秒
</form>

</body>
</html>

发表评论: