时间倒计时抢购效果
<<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="guest.js" type="text/javascript" charset="gb2312"></script>
<style>
*{
color: red; background: red;
}
</style>
</head>
<body>
<SPAN style="TEXT-ALIGN: center; background:pink; LINE-HEIGHT: 65px; WIDTH: 75px; LETTER-SPACING: 6px; PADDING-RIGHT: 33px; FONT-FAMILY: 'Myriad Pro'; FLOAT: left; HEIGHT: 55px; COLOR: #ffffff; FONT-SIZE: 60px; FONT-WEIGHT: normal" id=day>00</SPAN>
<SPAN style="TEXT-ALIGN: center; background:pink; LINE-HEIGHT: 65px; WIDTH: 75px; LETTER-SPACING: 6px; PADDING-RIGHT: 33px; FONT-FAMILY: 'Myriad Pro'; FLOAT: left; HEIGHT: 55px; COLOR: #ffffff; FONT-SIZE: 60px; FONT-WEIGHT: normal" id=hour>00</SPAN>
<SPAN style="TEXT-ALIGN: center; LINE-HEIGHT: 65px; WIDTH: 75px; LETTER-SPACING: 6px; PADDING-RIGHT: 33px; FONT-FAMILY: 'Myriad Pro'; FLOAT: left; HEIGHT: 55px; COLOR: #ffffff; FONT-SIZE: 60px; FONT-WEIGHT: normal" id=mini>00</SPAN>
<SPAN style="TEXT-ALIGN: center; LINE-HEIGHT: 65px; WIDTH: 75px; LETTER-SPACING: 6px; PADDING-RIGHT: 36px; FONT-FAMILY: 'Myriad Pro'; FLOAT: left; HEIGHT: 55px; COLOR: #ffffff; FONT-SIZE: 60px; FONT-WEIGHT: normal" id=sec>00</SPAN>
<SPAN style="TEXT-ALIGN: center; LINE-HEIGHT: 65px; WIDTH: 75px; LETTER-SPACING: 6px; PADDING-RIGHT: 30px; FONT-FAMILY: 'Myriad Pro'; FLOAT: left; HEIGHT: 55px; COLOR: #ffffff; FONT-SIZE: 60px; FONT-WEIGHT: normal" id=minisec>000</SPAN>
<SCRIPT type=text/javascript>
var now = new Date();
var start = new Date();
var end = new Date();
var n = now.getDay();
end.setDate(now.getDate() - n + 8);
var fnTimeCountDown = function(d, o){
var f = {
zero: function(n){
var n = parseInt(n, 10);
if(n > 0){
if(n <= 9){
n = "0" + n;
}
return String(n);
}else{
return "00";
}
},
dv: function(){
d = end || Date.UTC(2050, 0, 1); //è1′¨òê±￡òòéè¨μ1ê±èúê2050ê11è
var future = new Date(d), now = new Date();
//úà′2μ
var dur = Math.round((future.getTime() - now.getTime()) / 1000) + future.getTimezoneOffset() * 60,
dur_minisec = (Math.random())*1000, pms = {
minisec: "000",
sec: "00",
mini: "00",
hour: "00",
day: "00",
month: "00",
year: "0"
};
if(dur > 0){
pms.minisec = f.zero(dur_minisec);
pms.sec = f.zero(dur % 60);
pms.mini = Math.floor((dur / 60)) > 0? f.zero(Math.floor((dur / 60)) % 60) : "00";
pms.hour = Math.floor((dur / 3600)) > 0? f.zero(Math.floor((dur / 3600)) % 24) : "00";
pms.day = Math.floor((dur / 86400)) > 0? f.zero(Math.floor((dur / 86400)) % 30) : "00";
pms.month = Math.floor((dur / 2629744)) > 0? f.zero(Math.floor((dur / 2629744)) % 12) : "00";
//ê・Y￡°′°′1éê365ìì5ê±48・46
pms.year = Math.floor((dur / 31556926)) > 0? Math.floor((dur / 31556926)) : "0";
}
return pms;
},
ui: function(){
if(o.minisec){
o.minisec.innerHTML = f.dv().minisec;
}
if(o.sec){
o.sec.innerHTML = f.dv().sec;
}
if(o.mini){
o.mini.innerHTML = f.dv().mini;
}
if(o.hour){
o.hour.innerHTML = f.dv().hour;
}
if(o.day){
o.day.innerHTML = f.dv().day;
}
if(o.month){
o.month.innerHTML = f.dv().month;
}
if(o.year){
o.year.innerHTML = f.dv().year;
}
setTimeout(f.ui,1);
}
};
f.ui();
};
var zxx = {
$: function(id){
return document.getElementById(id);
},
futureDate: Date.UTC(end.getFullYear(), end.getMonth() + 1, end.getDate(), 12),
obj: function(){
return {
minisec: zxx.$("minisec"),
sec: zxx.$("sec"),
mini: zxx.$("mini"),
hour: zxx.$("hour"),
day: zxx.$("day"),
month: zxx.$("month"),
year: zxx.$("year")
}
}
};
fnTimeCountDown(zxx.futureDate, zxx.obj());
</SCRIPT>
</body>
</html>