svg+js实现毫秒级微妙数字时钟显示时间代码
代码语言:html
所属分类:其他
代码描述:svg+js实现毫秒级微妙数字时钟显示时间代码
代码标签: svg js实 毫秒级 微妙 数字 时钟 显示 时间 代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
body {
background: #2B55DD;
}
#clock {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: calc(100vw - 4px);
height: auto;
max-width: 300px;
}
</style>
</head>
<body>
<div id="clock"></div>
<script >
function initClock(elt, opt_properties) {
const defaultProperties = { color: '#0ff', date: new Date(), glow: true, militaryTime: false, showMs: true };
const c = Object.assign(defaultProperties, opt_properties);
!c.dotColor ? c.dotColor = defaultProperties.color : false;
const getSecondsPassed = (now = c.date, militaryTime = c.militaryTime) => {
const s10 = Math.floor(now.getSeconds());
const m10 = Math.floor(now.getMinutes() * 60 + s10);
const h = Math.floor(now.getHours() * 3600 + m10);
return { hour: h, minute10: m10, minute1: Math.floor(now.getMinutes() % 10 * 60 + s10), second10: s10, second1: Math.floor(now.getSeconds() % 10) };
};
let td = getSecondsPassed();
let vxEnd = c.showMs ? 175.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0