呼吸快门,用 p5.js 模拟镜头光圈的律动感,适合于网站 Loading 动画等场景

相机光圈

呼吸快门,用 p5.js 模拟镜头光圈的律动感,适合于网站 Loading 动画等场景

这是一款「呼吸快门」动态视觉效果,基于 p5.js 技术实现。灵感来自相机光圈的开合机制——叶片在收缩与展开之间循环,赋予画面一种均匀呼吸的节奏感。闭合时线条向中心聚拢成放射状,舒展时线条随旋转...

CSS+JS实现卡片悬停显示一圈彩色微光圈,效果特别的哇塞!

卡片微光

CSS+JS实现卡片悬停显示一圈彩色微光圈,效果特别的哇塞!

这是一款带光效交互的卡片组件,基于CSS滤镜+JS鼠标追踪技术实现,通过动态光影变化增强悬停反馈,可以自定义多种颜色的微光,外观效果特别的棒,适用于作品集展示或电商产品卡片场景。

纯CSS还原真实相机拍照动画,适用于摄影类产品官网和器材展示场景

真实相机

纯CSS还原真实相机拍照动画,适用于摄影类产品官网和器材展示场景

这是一款仿相机UI效果,基于纯CSS技术实现,通过多层渐变和阴影模拟镜头光圈机械结构以及照相机的完整外观,通过微调样式变换为各类品牌的相机,适用于摄影类产品官网和器材展示场景。