js颜色选择器 制作分析

1. 给html元素设置事件监听, 触发事件 弹出颜色选择器
2. 颜色选择器绘制
   1. 获取上次选择的颜色(当前颜色)
   2. 绘制渐变色板(canvas) (方法: 横轴渐变ff0000, ffff00, 00ff00, 00ffff, 0000ff, ff00ff, ff0000,覆盖纵轴渐变[渐变的是透明度,白色为hsv模式中的饱和度], 右边灰度调节底层纯色填充,上层黑色,透明度0-1渐变 )
   3. 绘制坐标指针(当前颜色标识)
3. 颜色选择器设置事件监听获取颜色
   1. 设置鼠标点击选取颜色,坐标指针同步
   2. 设置拖拽事件颜色预览
4. 向html元素返回选择的颜色值并改变相关css样式

转载于:https://www.cnblogs.com/helkbore/p/5381391.html