HTML and CSS Reference
In-Depth Information
EXPLANATION
(
CONTINUED
)
10
By using the
id
of the target, we get the value of the unique
id
that was assigned
to the object where the event occurred. The first
div
container is defined with an
id
name
“first”
. The
className
property defines the class for this object. When the
mouse rolls over this
div
, it will turn “red”.
11
The function,
unColorText()
, is triggered when the mouse moves over the text in
one of the
div
s. This function works like the
ColorText()
function, but turns the
text black when the mouse moves over the text, rather than coloring it. (It also
changes the font size.) The results are shown in Figure 15.46.
12
The three
div
containers are set up and positioned for the document.
Figure 15.46
Before the mouse rolls over the first
<div>
block (top left); after the
mouse has left all three containers (right). The font has changed in size and color for
each
div
.
In Chapter 1 we started talking about the three layers that make up a complete Web page:
1. The content or structural layer consisting of the HTML/XML markup.
2. The style or presentation layer consisting of the CSS style sheets.
3. The behavior layer consisting of JavaScript.
