RGBColor object
Represents a style value when it is color.
If the value of a style property is a color, you can use the getRGBColorValue method to retrieve an RGBColor object that represents the value.
Syntax:
Methods that return the object:
| • | CSSPrimitiveValue.getRGBColorValue ( ) |
The base interface, through which you can add new functionalities to the RGBColor object, is the RGBColor interface.
Possible members:
Properties:
|
Returns a CSSPrimitiveValue object that represents the blue component of the current RGB color.
This property is read-only. |
|||||||
|
Returns a CSSPrimitiveValue object that represents the green component of the current RGB color.
This property is read-only. |
|||||||
|
Returns a CSSPrimitiveValue object that represents the red component of the current RGB color.
This property is read-only. |
Example HTML code 1:
This example illustrates the use of the RGBColor object:
|
|
||||
<head> <script type="text/javascript"> function GetRGBComponents () { var div = document.getElementById ("myDiv"); if (window.getComputedStyle) { var compStyle = window.getComputedStyle (div, null); try { var value = compStyle.getPropertyCSSValue ("background-color"); var valueType = value.primitiveType; if (valueType == CSSPrimitiveValue.CSS_RGBCOLOR) { var rgb = value.getRGBColorValue (); var r = rgb.red.getFloatValue (CSSPrimitiveValue.CSS_NUMBER); var g = rgb.green.getFloatValue (CSSPrimitiveValue.CSS_NUMBER); var b = rgb.blue.getFloatValue (CSSPrimitiveValue.CSS_NUMBER); var message = "red: " + r + "\n"; message += "green: " + g + "\n"; message += "blue: " + b; alert (message); } else { alert ("The value of the background-color property is not an RGB function!"); } } catch (e) { alert ("Your browser does not support the getPropertyCSSValue method!"); } } else { alert ("Your browser does not support the getComputedStyle method!"); } } </script> </head> <body> <div id="myDiv" style="background-color:yellow;">An element with background-color.</div> <br /> Use the following button to get the red, green and blue components of the color specified by the background-color property! <button onclick="GetRGBComponents ()">Get RGB components</button> </body> |
||||
|
||||
|
Did you find this example helpful?
|
Related pages:
External links:
User Contributed Comments