时钟

下载代码

html

css

分享到微信朋友圈

html

css

JavaScript

let _timeElement10Digits = Array.from(Array(10)).map((n, i) => i);
let _timeElement6Digits = _timeElement10Digits.slice(0, 6);
let _timeElement3Digits = _timeElement10Digits.slice(0, 3);
let _timeElementStructure = [
	[_timeElement3Digits, _timeElement10Digits],
	[_timeElement6Digits, _timeElement10Digits],
	[_timeElement6Digits, _timeElement10Digits]
];

let clock = document.createElement("div");
clock.id = "clock";
document.body.appendChild(clock);
let digitGroups = [];

_timeElementStructure.forEach(digits => {
	let digitGroup = document.createElement("div");
	digitGroup.classList.add("digit-group");
	clock.appendChild(digitGroup);
	digitGroups.push(digitGroup);
	digits.forEach(digitList => {
		let digit = document.createElement("div");
		digit.classList.add("digit");
		digitList.forEach(n => {
			let ele = document.createElement("div");
			ele.innerText = n;
			digit.appendChild(ele);
		});
		digitGroup.appendChild(digit);
	});
});

粒子时间文字 hover canvas 3d 游戏音乐火焰水波轮播图鼠标跟随动画 css 加载动画导航菜单按钮滑块 tab 弹出层统计图 svg