时间数字和时间图片

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title></title>

</head>

<body>

<div id="time"></div>

<li id="beijing" class="time"></li>

<script type="text/javascript">

startTime()

function startTime() {

        document.getElementById('beijing').innerHTML = calcTime(+8)

  t = setTimeout('startTime()', 1000)

}

    function checkTime(i) {

        if (i < 10) { i = "0" + i }

        return i

    }

    function calcTime(offset) {

        var d = new Date();

        console.log(d.getTime())

        console.log(d.getTimezoneOffset())

        var utc = d.getTime() + (d.getTimezoneOffset() * 60000);

        var nd = new Date(utc + (3600000 * offset));

        var h = nd.getHours()

        var m = nd.getMinutes()

        var s = nd.getSeconds()

        h = checkTime(h)

        m = checkTime(m)

        s = checkTime(s)

        return h + ":" + m + ":" + s

    }


    //////////////

      window.onload=function(){

        getTime();

    }


    function getTime(){

        var date = new Date();

        var hours =formatTime(date.getHours());

        var minutes = formatTime(date.getMinutes());

        var seconds = formatTime(date.getSeconds());

        var $time = document.getElementById('time');

        $time.innerHTML=hours +"<img src='img/hm.png' style='margin:0 10px;' width='12' height='40'/>"+ minutes+"<img style='margin:0 10px;'  src='img/ms.png' width='12' height='40'/>"+ seconds;


        setTimeout("getTime()",500);

    }

    function formatTime(i){

        if(i<10&&i==1){

            i=  "<img src='img/0.png' width='40' height='60'/>"+"<img src='img/1.png' width='20' height='60'/>";

        }else if(i<10&&i!=1){

            i= "<img src='img/0.png' width='40' height='60'/>" + "<img src='img/"+i+".png' width='40' height='60'/>";

        }else{


            var j= i.toString().charAt(0);

            var z =i.toString().charAt(1);

          if(j<10 && z<10&&j!=1&&z!=1){

              i = "<img src='img/"+j+".png' width='40' height='60'/>" + "<img src='img/"+z+".png' width='40' height='60'/>";

            }else if(j<10 && z<10&&j==1&&z!=1){


              i = "<img src='img/1.png' width='20' height='60'/>" + "<img src='img/"+z+".png' width='40' height='60'/>";

          }else if(j<10 && z<10&&z==1&&j!=1){

                  i =  "<img src='img/"+j+".png' width='40' height='60'/>"+"<img src='img/1.png' width='20' height='60'/>";

          }else if(j<10 && z<10&&(j==1&&z==1)){

              i="<img src='img/1.png' width='20' height='60'/>"+"<img src='img/1.png' width='20' height='60'/>";

          }

        }

        return i;

    }

</script>

</body>

</html>

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。