Colors
Animations and effects in a page may often depend on computing
specific color values. Base provides an elementary Color class for encapsulating much of the
mundane logic in computing colors, converting them to and from
hexadecimal values, and so on. Several auxiliary functions for common
operations on colors are also included.
Creating and Blending Colors
The Color class has a
flexible constructor that can accept a named string value for a
color, a hex string representing a color, or an array of
RGB[18] values. Example 8-9
illustrates the creation of two Color objects and a function Base provides
for blending colors.
Example 8-9. Blending Color objects
<html>
<head>
<title></title>
<script
type="text/javascript"
src="http://o.aolcdn.com/dojo/1.1/dojo/dojo.xd.js">
</script>
<script type="text/javascript">
dojo.addOnLoad(function( ) {
var blue = new dojo.Color("#0000ff"); //could also have used "blue"
var red = new dojo.Color([255, 0, 0]);
var purple = dojo.blendColors(blue, red, 0.5);
dojo.style("foo", "background", purple.toCss( ));
});
</script>
</head>
<body>
<div id="foo" style="width:200px; height:200px; padding:5px;"></div>
</body>
</html>The blendColors function
accepted the red and blue Color
objects and blended them according to a 50/50 mixture to produce the
RGB value (128, 0, 128), a neutral shade of purple. The alternative
to blending colors is to crunch the numbers yourself—not rocket
science, but not very much fun either!
Table 8-10
summarizes the Color class provided ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access