2014-05-12 21 views
8

Bir öğenin arka plan rengini almak için aşağıdaki koda sahibim.RGB renk değerini, 0.75 alfadaki RGBA'ya dönüştürün

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

döndürür rgb(123,123,123)

gibi bir şey Şimdi ne 0.75 alfada bunu RGBA bu dönüştürmek ve gösteriyor istiyorum

rgba(123,123,123,0.75)

Herhangi bir fikir gibi yani dönen bir şey?

+0

Eğer regex kabul var deneyin? – nicolallias

+0

jQuerys $ .fadeTo-function kullanmak yerine rgba olarak değiştirmek istediğiniz herhangi bir sebep var mı? rgba eski tarayıcılarda çalışmaz. Bunun yerine $ (this) .fadeTo (0, 0.75) yapardım. – ninja

+0

@ninja Yorumunuzu cevap olarak gönderebilir, böylece oy verebilirim. JQuery'yi kullanıyorsanız daha iyi bir çözüm. – Anton

cevap

17

jQuery her zaman hiçbir alfa sahip elemanlar için rgb(r, g, b) gibi renk dönmek gibi görünüyor beri, sadece kullanabilirsiniz:

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

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

Sadece emin arka plan rengi önceden RGBA olmadığından emin olun kullanılarak

+0

Dikkat, eğer 'bu' arka plan rengi ayarlı değilse,' css ('arka plan rengi') '' undefined' döndürecektir. –

+0

Bunu başarmak için 'replace' vs' substr' kullanarak farklı bir jsperf testi ekledim. 'substr' açıkça kazanan. https://jsperf.com/replace-rbg-with-rgba – ctrlplusb

2

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)); 

Başka bir çözüm regex. Ancak, Cerbrus olarak belirtildiği gibi, bu basit bir şey için normal ifadeleri kullanmanız gerekir.

+0

'currentColor.replace (re, subst)' benim için şu gibi bir şey döndürüyor: '' rgb (255, 255, 255) '' – Cerbrus

+0

Sabit düzenli ifade rgb –

+0

'currentColor.replace (yeniden, subst)' - boşlukları kabul etmek için -> '" rgba (rgb, 255,255,0.75) "'. Düzenli ifadeler, bu 2 yedek parça kadar basit bir şey için çok fazla yoldur. – Cerbrus

0

Başka regex 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)'); 
+0

regex'leri, tek yapmanız gereken 1 tam dizgiyi eşleştirmekse çok fazla. – Cerbrus

+2

Öneri, konsept kanıtı, kodu geliştirmekten çekinmeyin. – nicolallias

İlgili konular