Comentário: Use o Canvas 'getImagedata para obter o valor da cor RGBA por pouco tempo e um pouco difícil
A seguir, é apresentado o código -fonte que exige que o navegador suporte html5<html>
<head>
</head>
<Body>
<Canvas onmouseMove = "ShowCurrentColor (Event)">
</canvas>
<br/>
<div>
</div>
<script type = "text/javascript">
if (document.createElement ("Canvas")) {
if (document.getElementById ("colorpicker"). getContext) {
var can = document.getElementById ("colorpicker");
can.setAtattribute ("altura", 300);
var cxt = can.getContext ("2D");
var gradiente = cxt.createlineargradiente (0,5,0,5,0,150);
gradiente.addcolorstop (0, '#00FF00');
gradiente.addcolorstop (1, '#ff0000');
cxt.fillstyle = gradiente;
cxt.fillrect (0,0,60,200);
var ox = can.offsetleft
var oy = can.offSettop;
var span = document.createElement ("input");
span.setAtattribute ("id", "rgba");
Document.getElementById ("TextResult"). ApndendChild (span);
}
}
Função ShowCurrentColor (e) {
var x = e.clientX - 8;
var y = e.clienty - 29;
var w = 10;
if (document.createElement ("Canvas")) {
if (document.getElementById ("colorpicker"). getContext) {
var can = document.getElementById ("colorpicker");
var cxt = can.getContext ("2D");
var gradiente = cxt.createlineargradiente (0,5,0,5,0,150);
var span = document.getElementById ("rgba");
var imgdatas = cxt.getImagedata (ox, oy, 10.200);
var imgdata = imgdatas.data;
var g = imgdata [4*(w)*(y) + (x)*4 + 1];
var r = imgdata [4*(w)*(y)+(x)*4];
var b = imgdata [4*(w)*(y) + (x)*4 + 2];
var a = imgdata [4*(w)*(y) + (x)*4 + 3];
span.value = "r ="+r+"g ="+g+"b ="+b+"a ="+a;
Document.getElementById ("TextResult"). ApndendChild (span);
}
}
}
</script>
</body>
</html>