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

Example 14.2:
Working With the Z-INDEX

This is Layer1

With a little text.

This is Layer2

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

Layer1 appears on top, though normally it would be below because it appears first in the HTML source document. We used the Z-INDEX to position these layers. You can use the buttons (which work with the moveAbove() method) to shift the layer positions.


This is how we created the layers: <LAYER NAME="Layer1" WIDTH=400 LEFT=250 TOP=10 BGCOLOR="orange" Z-INDEX=2> <H1>This is Layer1</H1> With a little text. </LAYER> <LAYER NAME="Layer2" WIDTH=400 LEFT=350 TOP=50 BGCOLOR="blue" Z-INDEX=1> <H1>This is Layer2</H1> With a little text. </LAYER> These are the buttons: <form> <INPUT TYPE="button" VALUE="Layer2 on Top" onclick="layers.Layer2.moveAbove(layers.Layer1)"><P> <INPUT TYPE="button" VALUE="Layer1 on Top" onclick="layers.Layer1.moveAbove(layers.Layer2)"> </form>
Previous Example-|-Next Example-|-Return to Chapter Listing