非HTML5 JavaScript RGB颜色选择器如何工作？

Question

我已经asked HSV颜色选择器如何工作，现在我想知道如何使用JavaScript的RGB颜色选择器。那些不使用HTML5 Canvas API的人。有人能解释一下他们背后的概念吗？

以下是我的意思：http://www.eyecon.ro/colorpicker/

注意：我没有准备好使用jQuery颜色选择器。我想开发自己的一个用于学习目的！ jQuery的解决方案很好！

Answer 1

假设您想要选择0到255之间的RGB值，类似于您要链接的示例，以下是我将如何处理它：

• 生成1个静态图像（1x256像素），其中包含右侧滑块中显示的“彩虹渐变”
• 生成1个256x256像素的静态叠加图像RGBA图像，如下所示
  • 左上：R = 1 G = 1 B = 1 A = 1
  • 右上：R = 0 G = 0 B = 0 A = 0
  • 左下：R = 0 G = 0 B = 0 A = 1
  • 右下：R = 0 G = 0 B = 0 A = 1
• 使用第一张图片作为滑块的背景。它应该生成要在颜色选择器的左上角显示的颜色。使用鼠标坐标查找颜色的实际Y值
• 创建一个'background'div（256x256像素），其中包含使用滑块拾取的颜色。将第二个静态图像用作顶部的叠加div。使用alpha值时，它应该为您提供白色和2个黑色角以及所需颜色的一个角。
• 在该方块中使用鼠标坐标。必须计算颜色。

我要离开为你创建公式和图像。 ：）