जावास्क्रिप्ट के माध्यम से सीएसएस के माध्यम से सटीक आरजीबीए मूल्य सेट कैसे प्राप्त करें?

Question

अधिकांश ब्राउज़रों में मैंने कोशिश की है, ब्राउजर पार्स सीएसएस के बाद आरजीबीए मान बदलना प्रतीत होता है।

उदाहरण के लिए, निम्नलिखित सीएसएस: जब jQuery.css ('पृष्ठभूमि रंग') या देशी CSSStyleDeclaration.getPropertyValue ('पृष्ठभूमि रंग') के माध्यम से सुलभ

background-color: rgba(255, 0, 0, 0.5); 

निम्नलिखित सीएसएस मूल्य देता है:

rgba(255, 0, 0, 0.498039) 

यहाँ और उदाहरण के साथ एक बेला है: http://jsfiddle.net/hgFEj/3/

क्रोम और सफारी विभिन्न परिणाम देते हैं। फ़ायरफ़ॉक्स एकमात्र ब्राउज़र प्रतीत होता है जो दर्ज किए गए सटीक मान की रिपोर्ट करता है। क्या यह एक बग या डिजाइन द्वारा है?

Answer 1

मार्क हबर्ट की टिप्पणी सही है।

32-बिट रंग टूटता चार 8 बिट घटकों, प्रत्येक 0-255 की सीमा के भीतर में नीचे: लाल, हरी, नीले, और अल्फा। हम अल्फा, या पारदर्शिता को एक अंश या प्रतिशत के रूप में व्यक्त करते हैं क्योंकि इससे हमें दशमलव-दिमाग वाले लोगों की मदद मिलती है कि यह कितना पारदर्शी है। यह धुँधलापन के रूप में (अच्छी तरह से, अस्पष्टता) के बाद से 100% पारदर्शी 0 1.

है अब नहीं,, 255 दिया की वास्तव में बेहतर सोचा है अल्फा मूल्य के लिए भाजक है, वहाँ 0.5 व्यक्त करने के लिए कोई रास्ता नहीं है ठीक ठीक। जो मूल्य आप देख रहे हैं, 0.4 9 8039, निकटतम अंश, 127/255 (6 दशमलव स्थानों तक गोल) से आता है। सफारी 0.4 9 60 9 4 लौटाता है जो 127/256 से 6 दशमलव स्थानों तक गोल होता है, और मेरे लिए एक बग लगता है क्योंकि यह 257 मूल्यों का तात्पर्य है। मुझे यह भी संदेह है कि फ़ायरफ़ॉक्स 0.5 की सटीक रिपोर्ट कर सकता है जब तक कि यह केवल 2 दशमलव स्थानों तक न हो।

आप एक jQuery प्लगइन बनाकर विभिन्न ब्राउज़रों में इस समस्या के आसपास काम कर सकते हैं, पहले निष्पादन पर, यह देखने के लिए जांचता है कि 50% अल्फा के साथ कौन सा मान वापस किया जाता है, और तदनुसार सभी गणनाओं को समायोजित करें।

parseFloat(
    $('#divWith50PercentAlphaBackgroundStyle') 
     .css('background-color') 
     .split(',')[3], 
    10 
) 

फिर, हाथ में इस मूल्य के साथ, मूल्यों विभिन्न ब्राउज़रों वापसी के खिलाफ उस पर एक switch करते हैं, और ठीक से निकटतम सही मान आप उम्मीद कर रहे हैं करने के लिए कनवर्ट करें।