圆点切换
CSS控制轮播切换的一串圆点按钮基于CSS和JavaScript实现了一串间隔有序的蓝色实心小圆点，当任意点击其中一个圆点时，被点击的圆点会突出放大显示并变为空心圆点效果，相邻两个圆点也会适当放大，其他圆点没有各类变化。其中...
鼠标拖尾
CSS彩色粒子粉末鼠标拖尾跟随效果这个效果通过使用Web组件（Web Component）来创建一个名为 <pointer-particles> 的组件。该组件会监控鼠标的移动事件的发生，当用户在页面上移动鼠标或点击时，会在鼠标...
钟表
HTML简约时尚风格时钟通过CSS与JS实现的简约风格时钟，黑白红三色非常的干净且时尚，仅5K大小的代码量即可实现，多功能的轻量级！主要用到了CSS的transform（转换）以及transition（过渡效果）等关键...
感应小游戏
HTML四色板点按顺序与音调记忆小游戏，考验你的记忆力以及音调感知能力一款通过CSS以及JavaScript实现的非常好玩的感应小游戏，通过记忆声音播放顺序或者四色版点按顺序加上自己对音乐的感知能力挑战游戏关卡。通过点击「开始」按钮开始游戏，仔细倾听播放的音调以...
插座触电
CSS插座触电疯狂颤抖摇晃动画效果通过CSS和少许地JavaScript实现了一种模拟触电的视觉动画效果。当用户通过鼠标点击墙上的插座孔时插座整个会颤抖摇晃起来，产生类似于触电的动画效果，当松开鼠标时页面会恢复原状。其中的插座以...
摇摆节拍
HTML实现的带摇摆动画效果的节拍器使用CSS以及JavaScript实现的带有「嘀嗒」声音和摇摆视觉节拍的简单在线节拍器。 支持设置 BPM 速度调整节拍数以及支持播放和暂停功能。其中仿「不倒翁」的摇摆效果是通过GSAP实现的。
艾珀妮
医院挂号与线上预约医疗服务App手机网站模板，采用PWA+Bootstrap技术实现「艾珀妮」是一款专为医疗行业打造的尖端app移动应用网站模板，旨在为医生和患者提供一个智能方便的在线预约沟通平台。该模板支持医生与患者的实时聊天沟通，并且能够展示医生的工作时间、费用、评级，点击...
创意时钟
HTML中通过SVG实现Apple Watch简洁风格的时钟动画创建了一个受Apple Watch时间启发的时钟主题SVG动画效果，时分秒分别对应着三个颜色不一样且从小到大依次嵌套的圆环，中心是数字时间，钟表的圆环轮廓是通过SVG矢量图实现的，细节样式是通...
查特旅
即时通讯社交App模板，通过 PWA 和 Bootstrap 技术实现「益易友」是一款专为手机社交聊天App设计的渐进式Web应用（PWA）模板，基于主流的Bootstrap 5框架、HTML5、CSS以及JavaScript技术构建。此模板包含55+个页面，并内...
动画logo
svg六边形与圆结合的logo，anime.js实现「半空掉落」出场动画效果创建一个带「半空掉落」出场效果的六边形与圆相结合的logo动画，其中六边形与圆是通过svg实现的，「掉落」的动画效果则是使用流行的JavaScript 库 anime.js 来实现，而整体的布...
文字悬停动画
基于GSAP和自定义JavaScript包装函数实现的8种创意的文字悬浮动画效果使用GSAP（GreenSock Animation Platform）和自定义的JavaScript字母包装函数实现的文字悬停动画，可以实现当鼠标悬停或者离开文字时，该字符会有独特的动画效果...
斯卡思
Tailwind CSS结合PWA技术实现的体育赛事播报及体育资讯App模板「斯卡思」是一款现代化、高性能的体育比赛以及体育资讯等体育行业App模板，是基于PWA技术结合Tailwind CSS技术实现的，可以被安装到用户升级等设备的主屏幕，提供接近原生应用的操作体验。...