错误提示
CSS 文本域输入错误抖动动画本 CSS 代码片段可为输入文本框创建错误抖动动画，当输入字段校验不通过时，文本域会触发抖动动画，以直观的方式突出显示问题。代码中提供了触发晃动动画的方法函数，您可以添加/移除这些函数，以便在...
黑洞动画
WebGL 鼠标光标驱动的旋涡黑洞动画效果基于WebGL技术在Canvas画布中实现的黑洞动画效果，会在鼠标箭头的周围形成科幻感极强的黑洞动画效果，当鼠标移动时黑洞会随之移动，是通过 WebGL 的 2d 技术实现的，实时的通过JS计算...
3D五环
CSS 3D动态奥运五环动画效果使用纯CSS实现的立体感非常强的3D奥运五环，主要是通过 CSS 的keyframes、filter、translate等关键属性实现，最终的奥运五环呈现不规则的左右摇摆效果，非常的有立体感，并...
Sophon倒计时
JavaScript 《三体》版星火倒计时时钟动画效果非常喜欢刘慈欣小说《三体》的银幕版--美版《三体》，尤其吸引我的是 Sophon 的倒计时，所以我抽空制作了自己的版本，通过 SVG 和每个路径点的噪声函数，我得到了一个带星火闪光动画的简化版...
带进度轮播
gsap 超实用炫酷的圆点进度指示器效果一款通过gsap.js实现的滚动轮播效果带圆点进度指示器的插件，左侧的圆点与右侧的内容一一对应，随着滚动鼠标内容切换的同时圆点进度指示器也会跟着移动，并且当鼠标悬浮在圆点上时圆点会变为右侧对应...
花环动画
CSS 枫叶花环动画效果使用纯 CSS 实现的枫叶组成的花环动画效果，主要是通过CSS的animation、background-color、transform三个主要属性经过合理的设置值实现最终效果。该动画效果可用...
滚动消息
JavaScript 文本无限横向滚动动画效果这是一款基于JavaScript结合CSS实现的文本横向滚动动画效果，非常适合应用于网站的滚动新闻、网站公告、警示信息、中奖信息等大量信息展示的场景，使其有条理的展示内容。实现上主要是利用JS控...
价格表单
CSS 响应式创意定价方案页面模板，价格平滑切换带可爱小熊动画效果一款使用CSS布局的价格方案网页模板，改价格方案页面支持平滑过渡的价格切换效果，并且附带可爱的交互性极强的可爱小熊动画效果，而且价格数字的变动设计了跳跃的动画效果。底层使用了CSS的has（）伪...
日食动画
Lume 网页端模拟日食全过程动画效果在html网页端通过Lume实现的日食变化全过程动画效果，实现起来特别简单，只需要在html网页中引入Lume插件，进行简单的设置即可实现，该效果可用在日常教学或者自己学习中。
插头开关
SVG 开关插头接电动画效果使用SVG结合CSS以及JavaScript实现的开关插头操控开关的动画效果，其中的插头和点线是svg生成的，整体的样式布局以及插头接电的动画效果是通过css实现的，屏幕点击事件是通过JavaS...
球体飞跃
Canvas 3D 玻璃球星际穿越与快速移动动画效果使用 Canvas 画布实现的星际穿越动画效果，同时也是一款球体快速移动的 Canvas 动画效果，动画中包含一个立体穿越形态的水晶玻璃球飞速向未知的远方飞去，旁边是反方向飞行的似火苗，似星云一...
3D动画树
CSS 交互式 3D 毕达哥拉斯树使用3D插件three.js构建的毕达哥拉斯树动画效果，支持配置树的递归深度、颜色，控制树的放大与缩小以及旋转3D毕达哥拉斯树，颜色支持随机颜色以及闪光霓虹灯颜色，此外还支持全屏查看。