考试倒计时

最新推荐文章于 2024-05-23 09:32:41 发布

LLSFAKE

最新推荐文章于 2024-05-23 09:32:41 发布

阅读量102

点赞数

文章标签： html css javascript

本文链接：https://blog.csdn.net/LLSFAKE/article/details/122364850

版权

HTML代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/mystyle.css"/>
		<script type="text/javascript" src="js/fun.js" defer="defer">		</script>
	</head>
	<body>
		<div class="box">
			离考试结束还有：<span id="minute">30</span>分钟<span id="second">00</span>秒
		</div>
	</body>
</html>

css代码

body{
	font-family: "arial black";
}
.box{
	margin: 0 auto;
	width: 1000px;
	text-align: center;
	font-size: 48px;
	border: 1px solid #ccc;
	background: #000;
	color: #fff;
	padding:50px;
	line-height: 48px;
}
.box>span{
	color: orange;
	font-size: 150%;
}

js代码

var myminute=document.getElementById("minute");
var mysecond=document.getElementById("second");
var total=1800;
var total2=1801;
var m,s;
function changeMin(){
	total--;
	m=parseInt(total/60);
	myminute.innerText=m;
	var timer=setTimeout("changMin()",100);
	if(total<=0){
		clearTimeout(timer);
	}
}
changeMin();
function changeSecond(){
	s=parseInt(total2%60);
	if(s<10){
		s="0"+s;
	}
	mysecond.innerText=s;
	var timer=setTimeout("changeSecond()",100);
	total2--;
	if(total2<=0){
		clearTimeout(timer)
	}
};
changeSecond();

LLSFAKE

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
考试倒计时

HTML代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="css/mystyle.css"/> <script type="text/javascript" src="js/fun.js" defer="defer"
复制链接

扫一扫