60 个 CSS 加载动画（您喜欢等待​​的地方！⌛😊）

加载动画是缩短网站和网络应用程序等待时间的理想选择。在这里，您可以找到一系列最具创意和灵感的加载动画！

更新版本已发布（点击）！ 🔥

由于 JavaScript 可以显著改善动画的功能和外观，因此有些动画都附带 JavaScript。

如果您喜欢加载动画，您可以简单地复制并粘贴。🙂（许可）

注意：所有按钮均在codepen.io上发布，而不是我发布的。

#1 自卸卡车装载动画

作者：Jon Kantner；
编码语言：HTML、CSS（SCSS）、JS；

#2 圆形中的正方形 – 加载动画

作者：Ray；
编码语言：HTML、CSS（SCSS）；

#3 彩虹装载机

作者：Jack Rugile；
编码：HTML、CSS；

#4 CSS 文本填充水

作者：Lucas Bebber；
编码语言：HTML、CSS（SCSS）；

#5 单元素 CSS 绝对中心覆盖微调器

作者：MattIn4D；
编码：HTML、CSS；

#6 材料设计旋转器

作者：Fran Pérez；
编码：HTML、CSS（SCSS）；

#7 加载

作者：dissimulate；
编码：HTML、CSS；

#8 齿轮加载动画

作者：Jamie Coulter；
编码语言：HTML（Haml）、CSS（SCSS）；

#9 立方体加载动画

作者：Paul Grant；
编码语言：HTML、CSS（SCSS）；

#10 CSS 加载动画 12

作者：马丁·范德里尔；
编码方式：HTML、CSS；

#11 加载动画

作者：Ioic；
编码语言：HTML、CSS（SCSS）；

#12 Pacman 在一个 div 中加载动画

作者：Iddar Olivares；
编码：HTML、CSS（Less）；

#13 加载动画 CSS

作者：Tatsuya Azegami；
编码：HTML、CSS（SCSS）；

#14 CSS Dash 加载器

作者：Cassidy Williams；
编码语言：HTML、CSS；

#15 编写加载动画

作者：Brandon Mathis；
编码语言：HTML、CSS（SCSS）；

#16 CSS加载动画

作者：John Urbank；
编码语言：HTML（Haml）、CSS（Sass）；

#17 唯一的 CSS 加载器 – Wizard

作者：Guilmain Dorian；
编码语言：HTML（Pug）、CSS（SCSS）；

#18 随机几何形状加载动画

作者：Tony Banik；
编码语言：HTML（Slim）、CSS（SCSS）、JS；

#19 画布加载动画

作者：Rachel Smith；
编码语言：HTML、CSS（SCSS）、JS；

#20 XBox SmartGlass 加载动画

作者：Adam Argyle；
编码语言：HTML（Pug）、CSS（Stylus）；

#21 加载动画 MySensors

作者：Edoardo；
编码：HTML、CSS（SCSS）；

#22 CSS Pancake 加载器

作者：Dario Corsi；
编码：HTML、CSS（SCSS）；

#23 加载动画

作者：John Heiner；
编码语言：HTML、CSS（SCSS）；

#24 旋转/脉冲加载动画

作者：Colin Horn；
编码语言：HTML、CSS（SCSS）、JS；

#25 CSS加载动画

作者：Glen Cheney；
编码语言：HTML（Haml）、CSS（SCSS）、JS；

➡️查看我博客上的其他按钮❤️