DOM Tutorials
Hiding and Showing Information
|
Home Page
DOM Tutorials
Hiding and Showing Information
|
If you've been using style sheets, you may already know about the visibility property. You can use it to reveal information when it's needed, as in the example below: (See how it was written)
|
The “Fur-B-Gone” pet brush is the latest advance in pet grooming. Although it may look like a medieval torture instrument, your pet will love it. Fido and Fluffy will actually look forward to being groomed! Buy one now! |
|
This works nicely, but has one drawback -- the hidden text still takes up room on the page. That's why, before you revealed the picture, this text appears to have an unnatural amount of blank space above it. It's also why the two different areas don't show up in the same location.
We could use position:absolute; to make the hidden areas appear at the same location, but if a user set her default font size to a large value, our carefully positioned areas might overwrite other text.
The display property
|
