javascript 倒计时 

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JS</title>
    <style>
        #box{
            width:600px;
            height:60px;
            line-height:60px;
            font-size:40px;
            text-align:center;
            border:3px solid pink;
            background-color:#f5f5f5;
            color:pink;
        }
    </style>
</head>
<body>
    <h1>倒计时</h1>
    <hr>
    <div id="box">
        
    </div>
    
    <script>
        //设计倒计时的时限
        var seconds = 400000;
        
        runTime();
        //声明函数
        function runTime(){
            //计算小时
            var h = Math.floor(seconds / 3600);
            var s = seconds - h * 3600;
            //计算分钟
            var m = Math.floor(s / 60);
            //计算秒
            s -= m * 60;
            
            //处理
            var h = (h<10)?'0'+h:h;
            var m = (m<10)?'0'+m:m;
            var s = (s<10)?'0'+s:s;
            
            //拼装字符串
            var dateStr = "距离世界末日还有 "+h+':'+m+':'+s;
            
            //赋值
            document.getElementById('box').innerHTML = dateStr;
            
            //判断
            if (seconds <= 0) {
                document.getElementById('box').innerHTML = "让地球重生吧！";
                return;
            }
            
            //时间减少
            seconds --;
            
            //定时
            setTimeout(runTime, 1000);
        }
        
        
        
        
    </script>
</body>
</html>

 

posted on 2015-12-20 14:46  岩_生  阅读(199)  评论(0)    收藏  举报

导航