原创教程--打造属于自己的倒计时
[ 2006-12-17 20:42:00 | By: 玉树临风 ]
 

 

看到很多博客有奥运倒计时,很好看.倒计时还有一种紧迫感.看了这个教程后,你就会有属于自己的倒计时了.

源码:

<div>离2007年5月1日还有</div>
<div id="TimeCounter" style="border:2px solid black;margin:5px;padding:2px;width:150px"></div>
<SCRIPT language=javascript>
<!--
//document.write("");

function show_date_time(){
window.setTimeout("show_date_time()", 1000);
target=new Date(2007,5,1,0,0,0);
today=new Date();
timeold=(target.getTime()-today.getTime());

sectimeold=timeold/1000
secondsold=Math.floor(sectimeold);
msPerDay=24*60*60*1000
e_daysold=timeold/msPerDay
daysold=Math.floor(e_daysold);
e_hrsold=(e_daysold-daysold)*24;
hrsold=Math.floor(e_hrsold);
e_minsold=(e_hrsold-hrsold)*60;
minsold=Math.floor((e_hrsold-hrsold)*60);
seconds=Math.floor((e_minsold-minsold)*60);

if (daysold<0) {
document.getElementById("TimeCounter").innerHTML="逾期,倒计时已经失效";
}
else{
if (daysold<10) {daysold="0"+daysold}
if (daysold<100) {daysold="0"+daysold}
if (hrsold<10) {hrsold="0"+hrsold}
if (minsold<10) {minsold="0"+minsold}
if (seconds<10) {seconds="0"+seconds}
if (daysold<3) {
document.getElementById("TimeCounter").innerHTML="<font color=red>"+daysold+"天"+hrsold+"小时"+minsold+"分"+seconds+"秒</font>";
}
else
document.getElementById("TimeCounter").innerHTML=daysold+"天"+hrsold+"小时"+minsold+"分"+seconds+"秒";
}
}
show_date_time();
//-->
</SCRIPT >

离2007年5月1日还有


1.
<div>离2007年5月1日还有</div>
这段代码改成你的时间.


2.target=new Date(2007,5,1,0,0,0);
2007,5,1,0,0,0改成你的倒计时时间.

3.solid:边框为实线. black是边框的颜色.width:150px边框的宽度,你还可以改.

这是个简单的源码,你还可以加图片进行美化.

 
 
 

 

 

发表评论:
数据加载中……


数据加载中……


数据加载中……


数据加载中……


数据加载中……


数据加载中……


数据加载中……



·转贴工具
·青青博客
·潇潇暮雨
·世外桃源的迷你窩
·第九行星
·王铁军书法网
·●毛毛虫●
·博客砖
·dang日誌
·辉煌人生
·花开
·风风雨雨
·连战博客
·Flash 神魂顛倒
·世外桃源 blogspot
·远景论坛
·卡饭论坛
·风云墙
·极限主题
·深度
·雨林木风
·魔派
·桃源空间

数据加载中……







抓虾
pageflakes
Rojo
狗狗
google reader
bloglines
my yahoo
newsgator
netvibes
鲜果









Powered by Oblog.