这是一个创建于 2782 天前的主题，其中的信息可能已经有所发展或是发生改变。
之前在很多 App 上看到加载动画都是三个点形式的，突发奇想试着用 CSS 做了三个点的加载动画，而且这些动画都是单元素实现的，也就是只有一个 div 标签。
因为单元素限制比较多，所以实现起来比较困难，很多加载动画有些生硬，但是基本实现了想要的效果。个人觉得这个项目比较能考验 CSS 功底。
大家也可以发挥想象力，条件是三个点以及一个元素，还能实现哪些动画效果，欢迎给我留言。
先贴上项目地址： https://github.com/nzbin/three-dots
第 1 条附言 · 2018 年 6 月 11 日
V 站的图片好神奇，有时候显示，有时候不显示，大家能看到预览图吗
 |
1
batnss 2018 年 6 月 10 日
红绿灯 233
|
 |
2
immao 2018 年 6 月 10 日 via Android
喜欢❤
|
 |
3
strugglexiang 2018 年 6 月 10 日
老哥，厉害
|
 |
5
zqjilove 2018 年 6 月 10 日
收藏了，已 star
|
 |
6
molvqingtai 2018 年 6 月 10 日 via Android
有种 CSS 叫别人写的 CSS😄
|
 |
7
veau 2018 年 6 月 10 日
收藏了，已 star
|
 |
8
nzbin OP @molvqingtai 😁
|
 |
9
mikac 2018 年 6 月 10 日
收藏一下，楼主好厉害
|
 |
10
JohnChiu 2018 年 6 月 10 日 via iPhone
很漂亮，点赞
|
 |
11
paicha PRO 不错，支持下。
|
 |
12
LeungJZ 2018 年 6 月 11 日
点赞，已 star。
|
 |
13
CasualYours 2018 年 6 月 11 日 via Android
之前看到有水波的效果，感觉也比较酷。
|
|
14
nzbin OP @CasualYours 水波纹的话两个点就可以实现
|
 |
15
narakus 2018 年 6 月 11 日
不错，已 star
|
 |
16
Desiree 2018 年 6 月 11 日
给力，向大佬学习。。
|
 |
17
iblessyou 2018 年 6 月 11 日
看不到预览图，查看页面源码 找到地址打开看到了。。。看一圈 感觉还是前几个那种常见的比较好
|
 |
21
wplct 2018 年 6 月 11 日
不错。star。给我们这些后端用用挺好的，比 git 好看
|
|
22
iblessyou 2018 年 6 月 11 日
@nzbin 加载图不仅仅是样式好看问题， 从用户体验上还有个很重要的作用就是消除人的焦虑心理
你看现在好多那种进度条都在上面弄个从左往右的动画，就是让人感觉动 尤其是左下那个，我脑补了下我要是等加载时，虽然效果不错，但看起来感觉“很慢” ，很不舒服 |
 |
24
imwangpan 2018 年 6 月 12 日
这个真的厉害啊，居然是单元素做的。简单看了下源码，第二个是用阴影做的？我真不知道阴影还有这种用法，简直打开了新世界的大门。
看了楼主的作品，让我加深了对 box-shadow 的理解，特别是 spread-radius，感谢分享！ |
Select Language