康诺科技java培训小课堂:Web前端——倒计时演示
用到的技术:HTML+CSS+JavaScript;主要以JavaScript为主。
操作步骤:
首先制作一个html页面;代码如下
!DOCTYPEhtml
html
head
metacharset="UTF-8"
title倒计时/title
/head
bodyh年6月30日JAVA高薪就业脱产实战班开班倒计时/h1
h2spanid="sid"/span/h2
/body
/html
利用JavaScript计算出距离指定时间的数值;代码如下
scripttype="text/JavaScript"
varendtime,nowtime,p,day,hours,minites,seconds
functiondaojishi(){
//设置结束时间endtime为年09月30日18:00
//设置当天时间为nowtime
endtime=newDate("/09/:00");
nowtime=newDate();
//计算时间差值,变量p
p=(endtime-nowtime)/;//毫秒
//将p转化成天数
daysw=parseInt(p/(24*60*60));
//console.log(p/(24*60*60*))
//将p转化成时、分、秒
//1小时==1*60*60*毫秒
hours=parseInt(p%(24*60*60)/(60*60));//小时
minites=parseInt(p%(60*60)/60);
seconds=parseInt(p%60);
document.getElementById("sid").innerHTML=
daysw+"天"+hours+"小时"+minites+"分钟"+seconds+"秒钟"
}
setInterval(daojishi,)
/script
最后用CSS让时间以红色显示;代码如下
styletype="text/css"
span{
color:red;
font-size:60px;
font-weight:bold;
}
.a{
color:blue;
}
/style
版权所有:康诺科技
/6/22
------------我是广告分割线---------------
赞赏