js实现炫酷时钟代码
代码语言:html
所属分类:其他
代码描述:js实现炫酷时钟代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> @import url(https://fonts.googleapis.com/css?family=Black+Ops+One); html, body { width: 100%; min-height: 100%; background: #181719; overflow: hidden; font-family: "Black Ops One", cursive; margin: 0; padding: 0; } </style> </head> <body> <script> var $ = function(id) {return document.getElementById(id);}; var $$ = function(el){return(document.createElement(el));} var h = function(){return window.innerHeight/1.5;} var w = function(){return window.innerWidth/1.5;} var maxsize = function(){return (h() < w()) ? h() : w();} var main = $$('div'); main.id = "hidden"; document.body.appendChild(main); function run(){ hands(); var outer_sec = setOuterSec(); position(draw(outer_sec)); var outer_min = setOuterMin(); position(draw(outer_min)); var outer_hour = setOuterHr(); position(draw(outer_hour)); var _hand = setHand(); position(draw(_hand)); midClock(); rot(); $('mid_clock').style.display = "block"; display(outer_sec); display(outer_min); display(outer_hour); var cnt = setInterval(function(){rot();}, 1000); } function rot(){ var t = new Date(); var sec = t.getSeconds(); var min = t.getMinutes(); var hour = t.getHours(); if(hour > 12)hour = hour - 12; var str = realtime(t); $('mid_clock').textContent = str; var seconds = Number($('id_hand_sec_ofs_deg').textContent); var minutes = Number($('id_hand_min_ofs_deg').textContent); var hours = Number($('id_hand_hour_ofs_deg').textContent); var srot = 360 +.........完整代码请登录后点击上方下载按钮下载查看
网友评论0