一个倒计时模块

/ 0评 / 0

[code lang="html"]
<!DOCTYPE html>
<html class="ui-mobile landscape min-width-240px min-width-320px min-width-480px min-width-768px min-width-1024px">
<head>
<title>
</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<link rel="stylesheet" href="css/ui-media.css">
<link rel="stylesheet" href="css/ui-base.css">
<link rel="stylesheet" href="css/ui-apple.css">
<link rel="stylesheet" href="css/style.css">
<script src="js/zy_anim.js">
</script>
<script src="js/zy_control.js">
</script>
<script src="js/zy_tmpl.js">
</script>
<script src="js/jquery-1.7.1.js">
</script>
<script>
zy_fix("header",null,0,function()
{
/*请在此插入网页初始化代码*/
});
</script>
<style type="text/css">
#time{margin:0px auto;width:80px;height:100px;}
</style>
</head>
<body class="ui-mobile-viewport" >

<!--header开始-->
<div id="header" data-role="header" class="ui-header ui-bar-c ui-header-fixed ui-bar-glass" >
<div class="ui-btn ui-btn-left ui-corner-all ui-shadow ui-btn-icon-right ui-btn-c " id="start"> <span class="ui-btn-inner"> <span class="ui-btn-text">开始</span> </span></span> <button class="ui-btn-hidden">按钮</button> </div>
<h1 class="ui-title" tabindex="0" role="heading" aria-level="1">
倒计时
</h1>
<div class="ui-btn ui-btn-right ui-corner-all ui-shadow ui-btn-icon-right ui-btn-c " id="stop"> <span class="ui-btn-inner"> <span class="ui-btn-text">结束</span> </span></span> <button class="ui-btn-hidden">按钮</button> </div>
</div>
<!--header结束-->
<div id="page_0" class="ui-page ui-body-d ui-page-active" tabindex="0">
<!--content开始-->
<div class="ui-content ui-body-d ui-fixed-top" style="padding:2.7em 0 0 0;">
<div id="container" style="min-height:27.3em" class="ui-bar-b">
<div id="time">
<p id="time-p">25:00</p>
</div>
</div>
</div>
</div>
<!--content结束-->
</body>
<script type="text/javascript">
var startFlag = false;
$("#start").click(function(){
if(startFlag == false){
timeTmp = setInterval('start()', 1000);
startFlag = true;
}
});
$("#stop").click(function(){
if(startFlag == true){
clearInterval(timeTmp);
$("#time-p").html(function(){
return "25:00";
});
minutes = 24;
seconds = 59;
startFlag = false;
}
})
function start(){
$("#time-p").html(function(){
return timer();
});
}
var minutes = 24,
seconds = 59;
function timer(){
tmp = minutes;
if(seconds == 0){
minutes -= 1;
seconds = 60;
}
var s10 = function(){
if(seconds < 10){
var tmpS = "0" + seconds;
return tmpS;
}else{
return seconds;
}
}
var m10 = function(){
if(minutes < 10){
var tmpM = "0" + minutes;
return tmpM;
}else{
return minutes;
}
}
tmp = m10() + ":" + s10();
if(seconds > 0){
seconds -= 1;
}
return tmp;
}
</script>
</html>
[/code]

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注