1
zythum 2012-07-04 17:38:22 +08:00
这个。必须有个canvas.. 不然真没办法做出个扇形...
|
2
cutehalo 2012-07-04 17:41:27 +08:00 1
|
3
cutehalo 2012-07-04 17:46:36 +08:00
or 这个 http://attasi.com/labs/volume/ ?
|
4
benzhe 2012-07-04 17:50:34 +08:00
http://nipponcolors.com 打开右侧的 On 后,左侧的颜色环在切换颜色的时候会有 CSS 动画
|
5
Mak 2012-07-04 17:57:48 +08:00
用 transform: matrix(......); 可以畫一個一角指向圓心的菱形,然後圓外面到部分用遮罩蓋起來就可以了。
麻煩的是遮罩層的邊框必須用圖片才能實現最外面哪個上黑下白漸變的「圓邊框」。 |
7
zythum 2012-07-04 18:05:25 +08:00
突然一想,貌似不用蒙板也能做。 吃完饭做个demo
|
10
yqrm 2012-07-04 18:27:53 +08:00
@cutehalo http://tutorialzine.com/ 这个站很不错,收藏了,感谢
|
11
zythum 2012-07-04 18:30:16 +08:00
radial-gradient 是做圆心向外这么个方向的渐变是做不错扇形的。
|
12
bitsmix 2012-07-04 18:47:51 +08:00 1
|
13
911 2012-07-04 19:00:42 +08:00 1
|
14
houkanshan 2012-07-04 19:23:51 +08:00
|
15
zythum 2012-07-04 19:43:50 +08:00
@houkanshan 和我实现实现的方式类似。但是用两个拼的话css transition怎么做过度呢。只能用js setTimeout或者祯动画做过度了
|
16
houkanshan 2012-07-04 19:49:25 +08:00
@zythum 嗯,原作者就是setTimeout过度的,实际上他的rotate都是setInterval控制的。。。
如果能用帧动画就更好了 |
17
benzhe 2012-07-04 19:54:53 +08:00
|
18
endintro 2012-07-04 20:02:48 +08:00
http://css-tricks.com/examples/ShapesOfCSS/ 里的Pac-Man + css3 transform rotate?
|
19
zythum 2012-07-04 20:08:04 +08:00 2
|
20
zythum 2012-07-04 20:17:29 +08:00
|
21
benzhe 2012-07-05 00:52:22 +08:00
@zythum 洗完澡我也做了一个 http://jsfiddle.net/DcYAb/
|
22
benzhe 2012-07-05 00:56:51 +08:00 1
|
23
zythum 2012-07-05 01:11:13 +08:00
good job
|
25
zythum 2012-07-05 01:58:59 +08:00
这个只是个实现过程。不能说是山寨... 样子什么的是设计。 动画流畅么.那就要动脑子了...
|