很多站长朋友们都不太清楚html怎么写倒计时三天,今天小编就来给大家整理html怎么写倒计时三天,希望对各位有所帮助,具体内容如下:
本文目录一览: 1、 html页面的倒计时代码。。。。急求!!!! 2、 倒计时html代码 3、 求html倒计时的代码! html页面的倒计时代码。。。。急求!!!!<body>
<div id="timer"></div>
<script type="text/javascript" language="javascript">
var endDate=new Date(2010,11,11,17,05,40);//年月日时分秒,月要减去1
(function daoJiShi()
{
var now=new Date();
var oft=Math.round((endDate-now)/1000);
var ofd=parseInt(oft/3600/24);
var ofh=parseInt((oft%(3600*24))/3600);
var ofm=parseInt((oft%3600)/60);
var ofs=oft%60;
document.getElementById('timer').innerHTML='还有 '+ofd+' 天 ' +ofh+ ' 小时 ' +ofm+ ' 分钟 ' +ofs+ ' 秒';
if(ofs<0){document.getElementById('timer').innerHTML='倒计时结束!';return;};
setTimeout('daoJiShi()',1000);
}());
</script>
</body>
倒计时html代码倒计时的html代码:
<!DOCTYPE?HTML>
<html>
<head>
<meta?charset="utf-8">
<title>CSS3圆环倒计时-源码搜藏网</title>
<style>
.pie?{?width:200px;?height:200px;?background-color:blue;?border-radius:100px;?position:absolute;?}
.pie1?{?clip:rect(0px,200px,200px,100px);?-o-transform:rotate(0deg);?-moz-transform:rotate(0deg);?-webkit-transform:rotate(0deg);?background:-moz-radial-gradient(20%?50%?0deg,?#333,?#0000ff);?background:-webkit-gradient(radial,?100?100,?0,?100?100,?110,?from(#000),?to(#0000ff));?}
.pie2?{?clip:rect(0px,100px,200px,0px);?-o-transform:rotate(0deg);?-moz-transform:rotate(0deg);?-webkit-transform:rotate(0deg);?background:-moz-radial-gradient(80%?50%?0deg,?#333,?#0000ff);?background:-webkit-gradient(radial,?100?100,?0,?100?100,?110,?from(#000),?to(#0000ff));?}
.hold?{?width:200px;?height:200px;?position:absolute;?z-index:1;?}
.hold1?{?clip:rect(0px,200px,200px,100px);?}
.hold2?{?clip:rect(0px,100px,200px,0px);?}
.bg?{?width:200px;?height:200px;?background-color:red;?border-radius:100px;?position:absolute;?box-shadow:0px?0px?8px?#333;?background:-moz-radial-gradient(0%?50%?0deg,?#900,?#ff0000);?background:-webkit-gradient(radial,?100?100,?0,?100?100,?110,?from(#900),?to(#ff0000));?}
.time?{?width:160px;?height:160px;?margin:20px?0?0?20px;?background-color:#fff;?border-radius:100px;?position:absolute;?z-index:1;?box-shadow:0px?0px?8px?#333?inset;?text-align:center;?line-height:160px;?font-family:"Book?Antiqua",?Palatino,?serif;?font-size:35px;?font-weight:bold;?text-shadow:?1px?1px?3px?#333;?}
.time?em?{?background:#fff;?position:absolute;?top:62px;?left:12px;?height:18px;?width:140px;?opacity:0.4;?}
</style>
</head>
<body>
<div?class="hold?hold1">
??<div?class="pie?pie1"></div>
</div>
<div?class="hold?hold2">
??<div?class="pie?pie2"></div>
</div>
<div?class="bg">?</div>
<div?class="time"><span></span><em></em></div>
<script?src=""></script>?
<script>
i?=?0;
j?=?0;
count?=?0;
MM?=?4;
SS?=?59;
MS?=?9;
totle?=?(MM+1)*600;
d?=?180*(MM+1);
MM?=?"0"?+?MM;
function?showTime(){
totle?=?totle?-?1;
if(totle==0){
clearInterval(s);
clearInterval(t1);
clearInterval(t2);
$(".pie2").css("-o-transform","rotate("?+?d?+?"deg)");
$(".pie2").css("-moz-transform","rotate("?+?d?+?"deg)");
$(".pie2").css("-webkit-transform","rotate("?+?d?+?"deg)");
}else{
if(totle>0??MS>0){
MS?=?MS?-?1;
if(MS?<?10){MS?=?"0"?+?MS};
};
if(MS==0??SS>0){
MS?=?10;
SS?=?SS?-?1;
if(SS?<?10){SS?=?"0"?+?SS};
};
if(SS==0??MM>0){
SS?=?60;
MM?=?MM?-?1;
if(MM?<?10){MM?=?"0"?+?MM};
};
};
$(".time?span").html(MM?+?":"?+?SS?+?":"?+?MS);
};
s?=?setInterval("showTime()",100);
function?start1(){
i?=?i?+?0.6;
count?=?count?+?1;
if(count==300){
count?=?0;
clearInterval(t1);
t2?=?setInterval("start2()",100);
};
$(".pie1").css("-o-transform","rotate("?+?i?+?"deg)");
$(".pie1").css("-moz-transform","rotate("?+?i?+?"deg)");
$(".pie1").css("-webkit-transform","rotate("?+?i?+?"deg)");
};
function?start2(){
j?=?j?+?0.6;
count?=?count?+?1;
if(count==300){
count?=?0;
clearInterval(t2);
t1?=?setInterval("start1()",100);
};
$(".pie2").css("-o-transform","rotate("?+?j?+?"deg)");
$(".pie2").css("-moz-transform","rotate("?+?j?+?"deg)");
$(".pie2").css("-webkit-transform","rotate("?+?j?+?"deg)");
};
t1?=?setInterval("start1()",100);
</script>?
<input?onclick="window.open('view-source:'?+?window.location.href)"?type="button"?value="查看源代码"?style="position:absolute;?right:0;?top:0;?width:80px;?height:30px;">
</body>
</html>
直接复制代码,创建html文件,然后复制进去,就可以看到效果了。
求html倒计时的代码!<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JS实现倒计时(时、分,秒)</title>
<script language="javascript" type="text/javascript">
var interval = 1000;
function ShowCountDown(year,month,day,divname)
{
var now = new Date();
var endDate = new Date(year, month-1, day);
var leftTime=endDate.getTime()-now.getTime();
var leftsecond = parseInt(leftTime/1000);
//var day1=parseInt(leftsecond/(24*60*60*6));
var day1=Math.floor(leftsecond/(60*60*24));
var hour=Math.floor((leftsecond-day1*24*60*60)/3600);
var minute=Math.floor((leftsecond-day1*24*60*60-hour*3600)/60);
var second=Math.floor(leftsecond-day1*24*60*60-hour*3600-minute*60);
var cc = document.getElementById(divname);
cc.innerHTML = "提示距离"+year+"年"+month+"月"+day+"日还有:"+day1+"天"+hour+"小时"+minute+"分"+second+"秒";
}
window.setInterval(function(){ShowCountDown(2010,4,20,'divdown1');}, interval);
</script>
</head>
<body>
<div id="divdown1"></div>
</body>
</html>
关于html怎么写倒计时三天的介绍到此就结束了,不知道本篇文章是否对您有帮助呢?如果你还想了解更多此类信息,记得收藏关注本站,我们会不定期更新哦。
查看更多关于关于html怎么写倒计时三天的信息的详细内容...