Previous Example-|-Next Example-|-Return to Chapter Listing

Example 14.5:
Hiding and Re-displaying Layers

[This example works with Netscape Navigator 4. It won't work with Netscape Navigator 2 or 3, or Internet Explorer 3.]

Use the buttons to hide and re-display the main layer and the child layer:

This text is in layer1.


This text is in layer1A.
Layer 1:

Layer 1A:


Here are our layers: <LAYER NAME="layer1" LEFT=360 TOP=256 BGCOLOR="#ffff00"><BR> <H1>This text is in layer1.</H1><BR> <LAYER NAME="layer1A" LEFT=72 TOP=80 VISIBILITY=show BGCOLOR="#8888ff"> This text is in layer1A. </LAYER> </LAYER> And this is how we hide and re-display them: <FORM NAME="layerForm"> <B>Layer 1:</B><BR> <INPUT TYPE="button" VALUE=" Hide " onclick="layers.layer1.visibility = 'hide'"> <INPUT TYPE="button" VALUE=" Inherit (Show)" onclick="layers.layer1.visibility = 'inherit'"><P> <B>Layer 1A:</B><BR> <INPUT TYPE="button" VALUE=" Hide " onclick="layers.layer1.layers.layer1A.visibility = 'hide'"> <INPUT TYPE="button" VALUE=" Inherit" onclick="layers.layer1.layers.layer1A.visibility = 'inherit'"> </FORM>
Previous Example-|-Next Example-|-Return to Chapter Listing