Dynamic HTML and Layers

 

A definition from Dreamweaver help

"A layer is a container in your Web page that holds HTML
page elements....You can stack one layer on top of another, hide some layers
while showing others, or move a layer across the screen with
a timeline. For example, you could have a background
image on one layer, then stack another layer on top that
holds text."

 

 

 

What is DHTML?

The term means Dynamic Hypertext Markup Language

It is a combination of HTML4 and Cascading Style sheets (CSS).

The elements work together through a scripting language.

Layers can be made one above the and revealed or hidden. They can also be animated.

 

What Exactly are Layers?

The idea of a layers is in some ways self explanatory as a visible surfacethat can have others below or above it.
Layers are part of DHTML which is an extension of HTMl that allows greater flexibility over layout and greater interactivity.

There is an advert below in three layers. It is however not converted to a table. Therefore any written text will disappear under the layer when it is displayed

If you click on each of the hyperlinks in turn each of the 3 hidden layers is revealed, then click refresh to reset the browser.

Click on these links in turn to show a page where a layer has been incorporated into a page layout.

You can create complex layouts without needing elaborate tables, as a layer can be made, placed where you want it and it can then be converted into a table to merge it with the rest of the page.

 



How do you create layers?
  1. Either select the layer drawing tool from the Objects panel (or go to Insert Menu and select Layer.)
  1. You can set preferences for layers in Edit Menu, Preferences. If you do this using Insert/Layer inserts a layer to your specification.
  1. If you use the Objects Panel a crosshair opens up and you go to the drawing area and draw out the layer to the size you want
 

Some points about creating layers

  • A good idea to turn on the grid in the View Menu and select Show Grid. Use Snap to Grid too if you want to layout several across a page.
  • Turn on the Layers Panel in the Windows Menu.
  • Give each layer a name using the Properties Panel.
  • If laying several out across a page turn on Prevent Overlaps.
  • If laying on top of each other, best not to have Snap to Grid or Prevent Overlap.

 

The layers Panel displays all the characteristics of each layer.
  • Visibility shows whether the layer will be visible when first displayed in a browser
  • the Z figure shows the position of the layerif they are stacked up on each other. The highest figure is on top.
Most of the properties are set in the Properties Panel. See the next page for how to set up the layers.