Connections
Exercises
Discussion Forums
Resources
Teaching

Connections Home Page


Other Connections Resources

Writing Resources

Web Directories and Search Engines

Documentation Guidelines

Copyright Information

Web Authoring

E-Mail

Newsgroups

MU*s and IRCs

Download Client Software

On-Line Newspapers and other News Sources

Government Sites

Humanities Sites

Resources for Writing Instructors

Scholarship on Hypertext and Computer-Assisted Pedagogy


English Home Page
Allyn & Bacon Home Page


ab_webmaster@abacon.com
©1997 Allyn & Bacon

Layers

Like the frames feature supported by most HTML browsers, the layers tag is concerned with controlling the way information is presented in the window of the browser. As of this writing, Netscape versions 4.0 and greater are the only browsers which support layers. Layers allow designers to more precisely place different pieces of information within the browser window. Additionally, different layers can be treated as objects, which can be controlled by the browser using JavaScripts. So, if you wanted to have an image move from left to right across the window of a browser, you could place that image as a layer within the Web page and use JavaScript commands to control its movement.

This kind of dynamic positioning of information on the page obviously requires some sophisticated programming. Fortunately, like most things on the Web, there are a number of functions that have already been developed and that you can use as references for developing your own pages. It is not necessary to understand every aspect of a more complicated Web development language like JavaScript in order to work with layers.

If you have Netscape 4.0 or higher, you can see a sample mockup page using layers.

Otherwise, you can get a sense for how they work by looking at this screen shot of the demo page.

As you can see from these examples, the layers tag is not overly complicated. Like other HTML commands, it works with the <TAG></TAG> pattern. In the example we can see that the first layer within the page is established with the <LAYER> command. A number of attributes can be added to the layer tag; for instance, here the distance from the left hand side of the browser window is specified with the <LEFT=0> attribute and the distance from the top of the window is designated by the <TOP=0> tag. In the sample shown, the first layer is associated with an HTML file with the SRC="layer1.html" tag. This allows designers to create information within the file layer1.html. In the sample, the </LAYER> tag closes the command for each layer. Each of the layers in our sample is also given a name. Naming the layers allows you to control the way that the browser treats each different layer. For instance, using a JavaScript, you might tell a browser to show "Layer1" for 5 seconds and then to hide "Layer1" and show "Layer2."

In general, the process for arranging information by placing it in layers and positioning the layers relative to the top and the left of the browser window is not complicated. In order to fully understand layers and put them to use for your projects, you'll need to do some experimentation. Eventually, you'll probably also want to do some work with JavaScript so that you can take full advantage of the functionality offered by layers. Like most of the more sophisticated Web building procedures, there is a lot to learn. Fortunately, most of the information that you will need is available on-line. One of the best tutorials is Adam Rebholz's (http://www.daily.umn.edu/~rebholz/). You can also get more extensive information at the Netscape Communicator Site (http://home.netscape.com/flash2/comprod/products/communicator/).