The Style Object's Interface

The style object has a very long list of properties. Fortunately, they're all easy to categorize as they mimic the different style properties we've discussed in this chapter.

 

background backgroundAttachment
backgroundColor backgroundImage
backgroundRepeat border
borderBottomColor borderBottomStyle
borderBottomWidth borderLeftColor
borderLeftStyle borderLeftWidth
borderRightColor borderRightStyle
borderRightWidth borderTopColor
borderTopStyle borderTopWidth
clear color
cssText display
font fontFamily
fontSize fontStyle
fontVariant fontWeight
height left
letterSpacing lineHeight
margin marginBottom
marginLeft marginRight
marginTop overflow
posHeight posLeft
posTop posWidth
textAlign textDecoration
textDecorationLinethrough textDecorationOverline
textDecorationUnderline textIndent
textTransform top
verticalAlign visibility
width zIndex

From time to time we see a very slight change as hyphenated properties lose their hyphens when translated into a property of the style object. For example, the style sheet font-size property corresponds to the style object's fontsize property. Other than this difference, the list of properties is identical.

With this discussion of the style property we can revisit the code we wrote earlier in the chapter to make a header disappear and reappear:

<H1 ID="MyHeader" STYLE="visibility:visible; text-align:center">Phantom Header</P>

<SCRIPT LANGUAGE="VBScript">
Sub Document_onKeyPress
   If MyHeader.style.visibility = "hidden" Then
      MyHeader.style.visibility = "visible"
   Else
      MyHeader.style.visibility = "hidden"
   End If
End Sub
</SCRIPT>

You can understand now exactly what we're doing in this code. The header object we created with a normal <H1> tag and gave the ID of MyHeader exposes a style object. Our code uses the visibility property of this style object to hide and show the header.