7

css 色盘、饼图、色轮

 2 years ago
source link: https://segmentfault.com/a/1190000040402336
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

css 色盘、饼图、色轮

发布于 12 分钟前

1.应要求要实现一个色盘取色器。

2.四处寻找无果,只能用图片实现了。
3.看书《揭秘css》时,发现了css的新属性,分享出来。

background: conic-gradient(red,yellow,lime,aqua,blue,fuchsia,red);

4.就这样实现了这个色盘,但是因为是新属性,有兼容性问题,使用的话要多调试。
5.当然要取色就要使用监听鼠标位置的属性,通过位置计算出角度和距离圆心的距离,就可以通过公式计算出颜色。用到了三角函数,后面优化后会贴出来。


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK