This
could either be a good thing, or a bad one, depending on your view. DHTML in NS 4 is quite
simple, and comes down to essentially one word- Layer. I was pretty astonished myself, but
its true- NS 4 relies completely on a new tag, called the <layer> tag, to spin up
its DHTML magic. This new tag is dynamic in that it can be positioned anywhere on a web
page (without relation to other content), moved around, its content inside updated on
demand, and more.

-Basic syntax

The basic syntax of the <layer> tag can't be simpler (as if any tag in HTML is
complicated!):

<layer>Text inside layer</layer>

The <layer> tag is a content tag, which means you can add into it content (like
<table>). Go ahead, try inserting the above code onto your page...you'll notice that
the text inside the layer floats above other text, and overlaps them.
Imagine a layer as a sheet of paper that resides on top of the rest of the page, and does
not take up space within the flow of the document.

-Layer attributes

A layer by itself can't be more boring, not to mention useless. Fortunately, there's
more to it. Layers support attributes that allow you to position it using the x,y
coordinates-system, give it a background, clip it (make only certain area of the layer
visible), hide it from view, and so on. I've listed the most important layer attributes
below:

Layer attributes

id

The name of the layer, used to identify it in your script

left

The position of the layer in relationship to the x coordinates

top

The position of the layer in relationship to the y coordinates

width

The width of the layer, in px or %

height

The height of the layer, in px or %

bgColor

The background color of the layer

background

The background image of the layer

src

The external html document contained inside the layer

Mix and match different attributes any way you like. Here's a sample layer that uses
some of the above attributes:

A layer

Notice I didn't specify the left and top attributes. When you don't, the layer is
positioned where you defined it.

-Scripting layers

Here's one of the most important thing to learn about layers- how to script them. After
all, its the scripts that make layers come alive. To access a layer, you need to use the
following syntax:

document.layername

Accessing the layer is just the first step. Once you've accessed a layer, you can then
go on and manipulate one of the layer's attributes to produce dynamic effects. I'll show a
simple example where a layer's background color interchanges between red and blue:

Here's the source code I used:

<layer id="test" width=80px
height=80px></layer>

<script
language="JavaScript1.2">//variable that helps alternate between red and blue
var thecolor=true//Apply a bgColor of blue as the initial layer color
document.test1.bgColor="blue"
function changecol(){//if thecolor=true
if (thecolor)
document.test.bgColor="blue"
else
document.test.bgColor="red"//set thecolor to the opposite of its current state
thecolor=!thecolor
setTimeout("changecol()",1000)
}
changecol()
</script>

All of the layers' attributes are read/write, so be sure to experiment with each of
them!