Search code examples
jqueryhtmlcsscolor-picker

Spectrum colorpicker get color with transparency


I use the jQuery plugin Spectrum for a color picker:

$('#backgroundColorPicker').spectrum({
    color: '#000',
    showAlpha: true,
    move: function(color){
        $('#result').css('background-color',color.toHexString());
    }
});

See this code in action here: http://jsfiddle.net/UkmXM/1/.

As you can see I set showAlpha to true to enable a transparent background. However, I don't get a transparent background.


Solution

  • A hex string doesn't support transparency. Use color.toRgbString() instead: http://jsfiddle.net/UkmXM/2/

    $('#backgroundColorPicker').spectrum({
        color: '#000',
        showAlpha: true,
        move: function(color){
            $('#result').css('background-color',color.toRgbString());
        }
    });