HTML and CSS Reference
In-Depth Information
To complete the changeStyle() function:
◗
1.
Within the
if
condition in the changeStyle() function, nest the following
if
state-
ment as shown in Figure 14-63:
/* Disable the style sheets whose title does
not match the sheet parameter */
if (links[i].title != sheet) links[i].disabled = true
else links[i].disabled = false;
Figure 14-63
disabling and enabling style sheets
sheet parameter
specifies the title of
the link to enable
disables the links that
do not match the
sheet parameter value
◗
2.
Save your changes to the file, and then reload
usconst.htm
in your Web browser.
◗
3.
Click the
Web view
,
Print view
, and
Large Text view
buttons to change the
style and layout of the document.
Trouble?
At the time of this writing, a program bug in Safari 5.1.2 for Windows
does not support enabling and disabling link elements for alternate style sheets.
Therefore, this code will not work under that Safari version.
Working with the
styleSheets
Object Collection
To complete the style sheet switcher, you had to modify the attributes of the
link
ele-
ment. Instead of working with the
link
element, you also can reference style sheets
directly using the following object collection:
document.styleSheets
The first style sheet that a browser encounters has an index value of 0, the second has
an index value of 1, and so on. Figure 14-64 lists the properties of individual style sheet
objects. Some of these properties are specific to one DOM, and some properties are read
only and cannot be modified by the browser.
