Source of the LAYER example

<SCRIPT>
var nMove0 = -10;
var nMove1 =   5;

function ChangeLayer(nLayer) {
var xLayer = document.layers["Layer" + nLayer]

  if (xLayer.visibility == "hide") {
     xLayer.visibility = "show"}
  else {
     xLayer.visibility = "hide"}
}

function moveLayer() {
var xLayer ;

  xLayer = document.layers["Layer1"];
  if (xLayer.left < 10 || xLayer.left > 500){
     nMove0 *= -1}
  xLayer.left += nMove0;

  xLayer = document.layers["Layer2"];
  if (xLayer.top < 10 || xLayer.top > 400){
     nMove1 *= -1}
  xLayer.top += nMove1;

  setTimeout("moveLayer()", 10);
  return;
}
</SCRIPT>

<FORM>
 <INPUT type="checkbox" value="Layer1" checked onClick="ChangeLayer(1)">Show layer 1<BR>
 <INPUT type="checkbox" value="Layer2" checked onClick="ChangeLayer(2)">Show layer 2<BR>
 <INPUT type="checkbox" value="Layer3" checked onClick="ChangeLayer(3)">Show layer 3
 <P>
 <INPUT type="button" value="Animate layers" OnClick="moveLayer(); return false;">
</FORM>

<LAYER bgcolor="#ffe0e0" top="200" left="250" name="Layer1" z-index="1">
<H1 style="color: #000">Layer number 1</H1>
</LAYER>

<LAYER bgcolor="#e0ffe0" top="225" left="275" name="Layer2" z-index="3" background="IMG1.jpg">
<H1><FONT color="yellow">Layer number 2</FONT></H1>
<A href="LAYER2.html" style="color: #d0d0ff">Source of this example</A>
</LAYER>

<LAYER bgcolor="#e0e0ff" top="150" left="300" name="Layer3" z-index="2" width="300" height="250">
<H1><FONT color="green">Layer number 3</FONT></H1>
</LAYER>
<P>