HTML and CSS Reference
EXAMPLE 14.32 ( CONTINUED )
<div id="third" style="position:absolute; top:150px">and
<input type="button" value="move and color text"
A CSS class for a style is defined. Text will be a red, Verdana font, point size 32.
The rgb (red, green, blue) color is used here for demonstration. It would be easier
to just assign red to the color property.
A CSS class for another style is defined. The text will be a blue, Verdana font, point
A CSS class for a third style is defined. The text will be a green, Verdana font, point
size 40. Notice that each class not only changes the color of the font, but increases
its point size.
When the onload event handler is triggered, just after the document has been
loaded, the user-defined init() function is called. The getElementById() method re-
turns references to three div objects.
A function called colorText() is defined. It sets the position of the div containers
and defines the color for the text in each container.
The className property is used to reference the CSS class named red , defined in
The className property is used to reference the CSS class named blue , defined in
The className property is used to reference the CSS class named green , defined in
The positions for each of the div containers are defined.
When the user clicks this button, the onClick event is triggered. It invokes the col-
orText() function, which will move and change the text in each of the div contain-
ers. The output is displayed in Figures 14.37 and 14.38.