CODEWITHSUNDEEP
javascriptjquerycssrgba
Tom
Tom

Reputation: 12988

Convert RGB color value to RGBA at 0.75 alpha

I have the following code to get the background color of an element.

var currentColor = $(this).css('background-color');

which returns something like rgb(123,123,123)

What I now want to do convert this to rgba and show it at 0.75 alpha

So returning something like rgba(123,123,123,0.75)

Any ideas?

Upvotes: 21

Views: 28466

Answers (3)

Henrik Peinar
Henrik Peinar

Reputation: 2201

http://regex101.com/r/lT9iM4

var re = /(rgb)\(([0-9]+),\s+([0-9]+),\s+([0-9]+)/; 
var currentColor = $(this).css('background-color');
var subst = 'rgba($2,$3,$4,0.75'; 

$(this).css('background-color', currentColor.replace(re, subst));

Another solution using regex. But as Cerbrus mentioned, using regex for something this simple is overkill.

Upvotes: 2

Cerbrus
Cerbrus

Reputation: 72839

Since jQuery always seems to return the color like rgb(r, g, b) for elements that have no alpha, you could simply use:

$(this).css('background-color').replace(')', ', 0.75)').replace('rgb', 'rgba');

Just make sure the background color isn't rgba already:

var bg = $(this).css('background-color');
if(bg.indexOf('a') == -1){
    var result = bg.replace(')', ', 0.75)').replace('rgb', 'rgba');
}

Upvotes: 32

nicolallias
nicolallias

Reputation: 1122

Another regex try http://jsfiddle.net/hc3BA/

var colour = 'rgb(123,123,123)',
new_col = colour.replace(/rgb/i, "rgba");
new_col = new_col.replace(/\)/i,',0.75)');

Upvotes: 6

Related Questions