百度倒计时的实现

 

<!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>百度一下,你就知道alonglee.net</title>
<style type="text/css">
<!--
#cd,#cd div{

background:url(http://www.baidu.com/img/cd.png)}
/* 这里调节位置,top 和 margin-left*/
#cd {
 display:block;
 position:absolute;
 width:126px;
 height:29px;
 overflow:hidden;
 top:50px;
 left:50%;
 margin-left:-63px;
 cursor:pointer;
*top:83px;    border: 1px solid #CCCCCC;
}
#cd div{position:absolute;width:12px;height:19px;overflow:hidden;background-position:0 -30px;top:4px;}
#n5{left:3px}
#n4{left:18px}
#n3{left:45px}
#n2{left:60px}
#n1{left:86px}
#n0{left:101px} 
-->
</style>
</head>

<body>

<div id="cd">
 <div id="n5"></div>
    <div id="n4"></div>
    <div id="n3"></div>
    <div id="n2"></div>
    <div id="n1"></div>
    <div id="n0"></div>
</div>

<script language="javascript" type="text/javascript">
 
 var d = document;
/* 
功能:给一个事件指派多个处理过程的
参数含义:
 C = this 不仅可以是windows 还可以是其他对象!
 B: click 事件类型
 A: 需要给对象C添加的【处理过程】

 addEventListener(evType, fn, false);Mozilla/Firefox 支持
 attachEvent("on"+evType, fn);IE5.0以上 Opera 支持该方法中事件用on开头

注意:attachEvent 所指派的多个过程的执行顺序是随机的,所以这几个过程之间不要有顺序依赖。
*/
function addEV(C,B,A)

 {if(w.attachEvent){
  C.attachEvent("on"+B,A); 
 } 
 else{
  if(w.addEventListener){C.addEventListener(B,A,false)} 
 } 
}

function G(A){ return d.getElementById(A)}

/* 这是关键 */
(function() 
 {

 /*
 I=1296576000000 含义:
 从1970-1-1 8:00:00 到 2011-2-2 0:00:00需要的毫秒数 ,考虑时区:北京时间+8
 如果用asp计算 :
 fromd = "1970-01-01 08:00:00"
 tod = "2011-2-2"
 response.Write(datediff("s",fromd,tod)) ==> 1296576000 秒 ===> 1296576000*1000毫秒
 
 举一反三:倒计时2011-5-1,如何做?你是知道的,对吧
 */
   var R=0,K=0,I=1296576000000,P,M=20*60*1000,F=72*3600*1000,L=12*60*1000,B=2*60*1000,Q=Math.random()*(L-B)+B,A=1000,C=false,N=G("cd");
  var D=[G("n0"),G("n1"),G("n2"),G("n3"),G("n4"),G("n5")];
  //alert(D.length)
  function J()
  {
   if(C){return } 
   var S=d.createElement("SCRIPT");
   S.src="http://chunjie.baidu.com/time.php?t="+new Date().getTime();
   d.getElementsByTagName("HEAD")[0].appendChild(S)
  } 
  
  
  window.CST=function(S)
  { 
   if(C)
   { return } 
   clearTimeout(P);
   R=parseInt(S);
   K=0;
   
   //R=0 I=1296576000000
   if(R<I){H()} 
   else{O()}

  } ;
 
  function E()
  {
   var X=I-R-K;
   if(X<F){N.style.display="block"}

   if(X<Q)
   {
    window.location.reload()
   } 
   var W=parseInt(X/3600000);
   var S=parseInt(X%3600000/60000);
   var V=parseInt(X%3600000%60000/1000);
   var T=[];
   T[5]=parseInt(W/10);
   T[4]=W%10;
   T[3]=parseInt(S/10);
   T[2]=S%10;
   T[1]=parseInt(V/10);
   T[0]=V%10;
   for(var U=0;U<6;U++)
   {
    D[U].style.backgroundPosition="-"+(T[U]*12)+"px -30px"
   } 
  }

  function H()
  { //K=0 A:1000
   K+=A;
   if(I-R-K<0){
    O();
    return } 
   
   //M=20*60*1000
   if(K>=M){ J()} 
   E();
   P=setTimeout(H,A)
  }

  function O()
  {
   clearTimeout(P);
   C=true;
   N.style.display="none"
  } 
  
  J();
  //alert(N.id); --#cd
  addEV(N,"click",new Function('window.open("http://chunjie.baidu.com","_blank");'))
 } 
)();
</script>
</body>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值