Question

I’m using Bootstrap Colorpicker in my Rails project and wanted to get the alpha in my JavaScript function. Does anyone know how to do this? I can easily get the color from the picker as illustrated in the example as:

$(function(){
  var bodyStyle = document.getElementById('body').style;

  $('#cp4').colorpicker().on('changeColor', function(ev){
    bodyStyle.backgroundColor = ev.color.toHex();
  });
});

Answer 1

You can get the alpha value as easily 🙂 You have it in the color object: ev.color.value.a

I set up a fiddle illustrating this. The code looks as follows:

$('#picker').colorpicker().on('changeColor', function(ev){
    alpha = ev.color.value.a;
    console.log(alpha);
    $('#alpha').append(alpha  + '</br>')
});​

The alphavariable is a number with the alpha value of the selected color.