花一个晚上做出的 css3 loading

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

爱意满满的作品展示区。

这是一个创建于 3701 天前的主题，其中的信息可能已经有所发展或是发生改变。

预览地址： http://jsbin.com/teguruhiqi/1/watch?output

第 1 条附言 · 2014-11-11 13:45:22 +08:00

之前的有bug 小修复了一下。哈
http://jsbin.com/gaxurigahu/1/edit?output

第 2 条附言 · 2014-11-12 23:01:18 +08:00

终极版来了哈哈哈
http://jsbin.com/muqehamelo/1/edit?css,output
添加了颜色，还有修改font-size可以直接改变整个loading的大小，非常的方便呢。。。。

CSS3

做出

14 条回复 • 2014-11-11 13:55:06 +08:00

huxia

2014-11-11 01:02:44 +08:00

keyframes 也是自己写的？现在应该有一些软件可以用gui调的吧？

huxia

2014-11-11 01:03:03 +08:00

强！忘了说，强！

msg7086

2014-11-11 02:44:22 +08:00

不支持Opera感觉就是意料之中的事情……

wovfeng

2014-11-11 06:46:23 +08:00

@huxia 嗯自己写的，这样可以慢慢调效果。软件什么的没有用过呢，不知道好不好用。

wovfeng

2014-11-11 06:47:19 +08:00

@msg7086 Opera15之后就是blink的内核了。所以理论上应该是支持Opera的。

bsbgong

2014-11-11 07:39:23 +08:00

不错
背景色渐变的话，旋转的三维效果更明显

lijinma

2014-11-11 09:26:07 +08:00

上海电信 load 不出来你的所有的 static 下面的内容

msg7086

2014-11-11 09:31:19 +08:00

@wovfeng 自然说的不是Blinkera

wincat

2014-11-11 09:39:01 +08:00

大神，为虾米我复制黏贴到自己的页面下看到的效果却变了？firefox 33。求教！

wovfeng

2014-11-11 13:03:37 +08:00

@wincat e... 我开发移动端的，很久都没有care firefox了。如果需要的话，我可以优化下的

Seita

2014-11-11 13:19:33 +08:00

Dropbox 会收购这个 loading 的 :D

wovfeng

2014-11-11 13:40:08 +08:00

@wincat http://jsbin.com/gaxurigahu/1/edit?output 嗯我修改好了哈哈果然很多bug。谢谢你

wincat

2014-11-11 13:49:10 +08:00

@wovfeng 赞！立马给用上

wincat

2014-11-11 13:55:06 +08:00

@wovfeng 完美