"Arka plan rengi" rgb() biçimine nasıl dönüştürülür?

İşte benim sorunum:"Arka plan rengi" rgb() biçimine nasıl dönüştürülür?

Sayfanın bir öğesinin arka plan renginin opaklığını değiştirmek istiyorum. Bunu yapmak için önce rengi rgb() biçimine dönüştürmem gerekiyor. (veya r, g ve b elementlerini ayıklayın).

here Altıgen bir dizeyi sayısal biçime dönüştürme işlemini nasıl yaparım, ancak renkler her zaman hex biçiminde değil. "kırmızı" gibi renkler olarak adlandırılabilirler.

red  ---> rgb(255, 0, 0) 
#ff00ff ---> rgb(255, 0, 255)

Bunun nasıl yapılabileceği hakkında bir fikri olan var mı?

Saygılarımızla.

kaynak

2011-09-18 Mo Valipour

Bu 'rgba()' biçiminde değil, 'rgb()' biçimidir. Bir fark yaratmayan – BoltClock

, rgb() ve rgba() formatları birbiriyle kolayca değiştirilebilir. Sorunu daha net hale getirirse düzenleyebiliriz. –

RGB veya HEX için bir colorName dönüştürmek için, öncelikle yapabileceğiniz daha renkli isimlerinden ve ilgili değerlerin bir sözlüğü gerekir:

kaynak

2011-09-18 21:30:29

lütfen tekrar soruyu okuyun, bu sadece hex dizeleriyle çalışır. –

tamam valipour. Daha sonra [kırmızı, yeşil, gri, siyah ....] bir var listesini yazmak ve değerlerini dönüştürmek için hemen haklıyım. –

Bu mümkün ama dürüst olmak için iyi hissetmiyorum, tarayıcı zaten onu bildiği için tarayıcıdan almak için orada olması gerektiğini düşünüyorum! –

Kullanım window.getComputedStyle(elem, null).getPropertyValue("background-color"); arka plan rengi dizesini elde etmek için Ardından, istenen bir formatta olup olmadığını kontrol edin.

rgb (n, n, n) böyle HSL, RGBA, HSLA olarak
Diğerleri, ... bunlar kolay bulmak algoritması
Renk adlarını kullanarak dönüştürmek: Oluştur colornames-to-rgb (örneğin: var name2rgb = {red: "rgb(255, 0, 0)"};) haritası

renk adlarının bir listesi web üzerinde bulunabilir. Renk adlarının bir listesi için this site adresini ziyaret edin (muhtemelen not complete).

kaynak

2011-09-18 21:34:10

size r ve istediğiniz herhangi bir biçimi oluşturmak için kullanabileceğiniz g ve b alacak Bu fonksiyon: Tüm örneklerde

color_1 = resolve_color('#FFCC00'); 

color_2 = resolve_color('#FC0'); 

color_3 = resolve_color('rgb(255, 204, 0)'); 

color_4 = resolve_color('rgb(100%, 80%, 0%)');

, color_N edilir:

/* color_N is an array 
* - color_N['red'] : 255 
* - color_N['greenn'] : 204 
* - color_N['red'] : 0 
*/

Fonksiyon

function resolve_color(color){ 
    // return an array containing R, G and B values 
    if(color === 'transparent')// IE (6 and ?) 
     color = '#FFF'; 
    var r,g,b; 
    var hex_color_pcre = new RegExp("^#[0-9a-f]{3}([0-9a-f]{3})?$",'gi'); 
    var rgb_color_pcre = new RegExp("rgb\\(\\s*((?:[0-2]?[0-9])?[0-9])\\s*,\\s*((?:[0-2]?[0-9])?[0-9])\\s*,\\s*((?:[0-2]?[0-9])?[0-9])\\s*\\)$",'gi'); 
    var rgb_percent_color_pcre = new RegExp("rgb\\(\\s*((?:[0-1]?[0-9])?[0-9])%\\s*,\\s*((?:[0-1]?[0-9])?[0-9])%\\s*,\\s*((?:[0-1]?[0-9])?[0-9])%\\s*\\)$",'gi'); 
    if(color.match(hex_color_pcre)){ 
     if(color.length == 4){ 
      r = color.charAt(1)+""+color.charAt(1); 
      g = color.charAt(2)+""+color.charAt(2); 
      b = color.charAt(3)+""+color.charAt(3); 
     } 
     else{ 
      r = color.charAt(1)+""+color.charAt(2); 
      g = color.charAt(3)+""+color.charAt(4); 
      b = color.charAt(5)+""+color.charAt(6); 
     } 
     r = h2d(r); 
     g = h2d(g); 
     b = h2d(b); 
    } 
    else if(color.match(rgb_color_pcre)){ 
     r = RegExp.$1; 
     g = RegExp.$2; 
     b = RegExp.$3; 
    } 
    else if(color.match(rgb_percent_color_pcre)){ 
     r = parseInt((RegExp.$1)*2.55); 
     g = parseInt((RegExp.$2)*2.55); 
     b = parseInt((RegExp.$3)*2.55); 
    } 
    else 
     return false; 

    var returned =[]; 
    returned['red'] = r; 
    returned['green'] = g; 
    returned['blue'] = b; 
    return returned; 
} 

function h2d(h) { 
    // hex to decimal 
    return parseInt(h,16); 
}

kaynak: http://www.kadimi.com/en/javascript-tween-function-368

kaynak

2011-09-18 21:46:28

"Arka plan rengi" rgb() biçimine nasıl dönüştürülür?

cevap

İlgili konular