霓虹灯数字
SVG+CSS使用具有遮挡渐变霓虹灯效果的数字时钟基于CSS实现的霓虹灯效果数字时钟，外观超靓丽，其中数字表盘是基于SVG矢量图实现的，遮挡渐变效果的霓虹灯效果数字是通过CSS的渐变（gradient）和遮罩（mask）等关键属性实现的，表的正...
透视钟表
CSS实现具有透视效果表盘的模拟时钟通过CSS结合JS实现的一款具有透视数字表盘效果的模拟时钟，使用了CSS的perspective关键属性实现的透视效果，JS控制时分秒指针移动。这种效果仿佛你正通过一根管子观察它们，这种设计可...
划线时钟
CSS+SVG创意黑板上划线计数的数字时钟通过CSS结合SVG实现的一款黑板上划线计数的数字时钟，这款效果有没有让你幻想起曾经那些年在班级里投票选班干部的场景？好有时代感的一款效果，实现起来不难，背景是一张黑板照片，划线的素材是通过SV...
罗马时钟
CSS+JS实现拥有罗马数字金属骨架外观的罗马模拟时钟通过CSS结合JavaScript实现的罗马模拟时钟，时钟的表盘是通过罗马数字符号的金属架构组成的，相当有金属质感和古老风格的一款时钟效果。并且支持鼠标悬浮显示阿拉布数字的时间提示。实现这一款...
翻页时钟
CSS翻页效果主题数字时钟一款通过CSS结合JavaScript技术实现的翻页效果数字时钟，数字时钟的时分秒数字变化像是翻页一样特别的有创意。基本的HTML代码结构如下，通过CSS设置时分秒三块区域的样式及动画效果，J...
饼图钟表
SVG+CSS饼图主题模拟时钟，指针扫过的区域是一个饼图！基于CSS+JS+SVG实现的一款创意模拟时钟，钟表指针扫过的区域阴影部分是一个饼图效果，而整个钟表的表面被划分为了三个不同颜色的区域，其中钟表素材是由svg实现的，饼图时钟整体效果是由CSS实...
数字串钟表
CSS+JS实现通过当前时间的时分秒数字串起来的指针组成的创意模拟时钟！一款特别有创意的模拟时钟效果，钟表的时分秒常见指针都是通过当前时间所对应的数字串联到一起的，随着时间规则的走动。这款有趣的钟表效果实现起来也很简单，通过CSS绘制表盘以及指针行走动画，JavaS...
钟表
HTML简约时尚风格时钟通过CSS与JS实现的简约风格时钟，黑白红三色非常的干净且时尚，仅5K大小的代码量即可实现，多功能的轻量级！主要用到了CSS的transform（转换）以及transition（过渡效果）等关键...
创意时钟
HTML中通过SVG实现Apple Watch简洁风格的时钟动画创建了一个受Apple Watch时间启发的时钟主题SVG动画效果，时分秒分别对应着三个颜色不一样且从小到大依次嵌套的圆环，中心是数字时间，钟表的圆环轮廓是通过SVG矢量图实现的，细节样式是通...
3D时钟
CSS实现的3D悬浮晃动数字时钟，附带倒影及虚拟效果使用CSS与JavaScript实现的3D数字时钟效果，在HTML页面中数字时钟会在三维立体空间中缓慢转动，时钟数字呈现部分虚拟效果伴随有影子效果。数字的变动事件是通过JS控制的，时钟的3D效果...
Sophon倒计时
JavaScript 《三体》版星火倒计时时钟动画效果非常喜欢刘慈欣小说《三体》的银幕版--美版《三体》，尤其吸引我的是 Sophon 的倒计时，所以我抽空制作了自己的版本，通过 SVG 和每个路径点的噪声函数，我得到了一个带星火闪光动画的简化版...