zoukankan      html  css  js  c++  java
  • JavaScript实现两小时倒计时

    【构思】

      因为只需要的是两小时,所以时间直接写死,然后通过setInterval每1000ms对时间进行减1操作

      前期未考虑到当时分秒小于10的状态,所以后面又加上了一个checkTime()来进行限制,小时则直接在变量中加了。

    【步骤】

      

    <html>
        <head>
            <title>2小时倒计时</title>
            <style>
                *{
                    margin: 0;
                    padding: 0;
                }
                .cutDown{
                     100%;
                    height: 100%;
                    background: url(2.jpg) no-repeat;
                    background-size: 100%;
                    text-align: center;
                    color: #fff;
                    font-size: 80px;
                    font-weight: 100;
                    font-family: monospace;
                    position: absolute;
                    bottom: 0px;
                }
            </style>
        </head>
        <body >
            <div id="time" class="cutDown"></div>
            <script>
            window.onload = function(){
                var time = {
                    init: function() {
                        var oTime=document.getElementById("time");
                        var h='0' + 1;
                        var m=59;
                        var s=59;
                        oTime.innerHTML="02 : 00 : 00";
    
                        //进行倒计时显示
                        var time = setInterval(function(){
                            --s;
                            if(s<0){
                                --m;
                                s=59;
                            }
                            if(m<0){
                                --h;
                                m=59
                            }
                            if(h<0){
                                s=0;
                                m=0;
                            }
                        // 判断当时分秒小于10时补0
                            function checkTime(i){
                                if (i < 10) {
                                    i = '0' + i
                                }
                                return i;
                            }
                            s = checkTime(s);
                            m = checkTime(m);
                            oTime.innerHTML=h+" : "+m+" : "+s;
                        },1000);
                    }
                }
                time.init();
            }
            </script>
        </body>
    </html>
    

      

      

  • 相关阅读:
    Day1:T1 模拟 T2 拓扑排序
    vijos1060 隔板法
    字符串处理:kmp算法
    vijos1004 博弈论
    vijos1009:扩展欧几里得算法
    有关浮点数的精度问题
    C++构造 下一个排列 的函数
    vijos1053 用spfa判断是否存在负环
    SPFA和FLOYD算法如何打印路径
    细节MARK
  • 原文地址:https://www.cnblogs.com/wangyang0210/p/9546188.html
Copyright © 2011-2022 走看看