发布时间：2025-12-09 12:00:38 浏览次数：1
<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <title>网页闹钟</title> <meta name="Keywords" content="关键字,关键字"> <meta name="description" content=""> <style type="text/css"> *{margin:0px;padding:0px;} body{font-size:14px;font-family:"微软雅黑";color:#666;background:#E2E2E2;} /* start timerbox */ .timerbox{width:400px;height:400px;margin:0 auto;} .timerbox .box{width:200px;height:200px;border:4px solid #E2E2E2;border-radius:50%;position:relative;left:100px;top:100px;} .timerbox .box #radius{position:absolute;width:20px;height:20px;top:90px;left:90px;background:#111;border-radius:50%;} .timerbox .box #hour{position:absolute;height:45px;width:8px;background:#111;left:96px;top:55px;transform-origin:bottom;} .timerbox .box #min{position:absolute;height:60px;width:4px;background:green;left:98px;top:40px;transform-origin:bottom;} .timerbox .box #sec{position:absolute;height:80px;width:2px;background:red;left:99px;top:20px;transform-origin:bottom;} .timerbox .box ul li{list-style:none;background:#111;width:2px;height:5px;position:absolute;left:99px; transform-origin:center 100px;} .timerbox .box ul li:nth-child(5n+1){height:15px;} /* timerbox end */ </style></head><body><!-- start timerbox --><p > <p > <ul > <li></li> </ul> <p ></p> <p ></p> <p ></p> <p ></p> </p></p><!-- timerbox end --><script type="text/javascript"> (function() { var keduDom = document.getElementById("kedu"); var html=""; for (var i = 0; i < 60; i++) { html += "<li style='transform:rotate(" + (i * 6) + "deg)'></li>" } keduDom.innerHTML = html; var secDom = document.getElementById("sec"); var minDom = document.getElementById("min"); var hourDom = document.getElementById("hour"); function drawDate() { var date = new Date(); var sec = date.getSeconds(); var min = date.getMinutes() + sec / 60; var hour = date.getHours() + min / 60; secDom.style.transform = "rotate(" + sec * 6 + "deg)"; minDom.style.transform = "rotate(" + min * 6 + "deg)"; hourDom.style.transform = "rotate(" + hour * 30 + "deg)"; } drawDate(); setInterval(drawDate, 1000); })();</script></body></html>免责声明：本站内容（文字信息+图片素材）来源于互联网公开数据整理或转载，仅用于学习参考，如有侵权问题，请及时联系本站删除，我们将在5个工作日内处理。联系邮箱：303555158#qq.com（把#换成@）
微信便捷交流