huidong

首页 | 会员登录 | 关于争取 2022 寒假做出汇东网 Ver3.0.0 !
搜索文章


想在屏幕上显示大字号、居中的时间,可惜 windows 的自带时钟居然不行。


于是简单做了一个,很简易很简易的。


由于我的系统是黑色调的,所以这个时钟支持黑白双色主题。


代码:

<html> 
<head> 

    <title>CLOCK</title>

    <script type="text/javascript"> 
    
        // 当前页面主题色,0 为白色,1 为黑色
        var style = 0;
    
        function startTime() 
        { 
            var today=new Date() 
            var h=today.getHours() 
            var m=today.getMinutes() 
            var s=today.getSeconds() 
            // 当数字是小于10的就要在前面加0.看起来规范 
            m=checkTime(m) 
            s=checkTime(s) 
            document.getElementById('txt').innerHTML=h+":"+m+":"+s 
            t=setTimeout('startTime()',1000) 
            } 
            function checkTime(i) 
            { 
            if (i<10) 
            {i="0" + i} 
            return i 
        } 
        
        // 切换主题
        function changeStyle()
        {
            if(style)
            {
                document.body.style = "background-color:white;color:black";
                style = 0;
            }
            else
            {
                document.body.style = "background-color:black;color:white";
                style = 1;
            }
            
        }
    </script> 

</head> 

<body onload="startTime()"> 

    <div style="height:30%"></div>
    <div id="txt" style="text-align:center;font-size:150"></div> 
    
    <button onclick="changeStyle()">Change style</button>
    
</body> 

</html>


效果如何,运行便知。


显示时间直接用的  w3c 的例子:https://www.w3cschool.cn/xqw2e7/s5fk19wz.html 





返回首页


Copyright (C) 2018-2024 huidong