<LAYER>

NN 4 IE n/a HTML n/a

<LAYER>...</LAYER>

End Tag: Required

A LAYER element is a positionable element in Navigator's object model (e.g., like a block-level element whose CSS position: attribute is set to absolute). As a result, many of the attributes are named according to the Navigator way of positioning, sizing, and stacking positionable elements. It is unlikely that the LAYER or the related ILAYER elements will be adopted by the W3C, so you are encouraged to use CSS-Positioning syntax (which works on both browser platforms) instead.

Content for a LAYER element can be read from a separate file (with the SRC attribute) or wired into the current document by placing the HTML between the start and end tags. You can include both types of content in the same LAYER element. Content from the SRC document is rendered first (as its own block-level element), with additional content starting on its own line below the external content's rectangle.

A LAYER element can be positioned anywhere within a document and can overlap content belonging to other layers (including the base document layer). Under link or script control, content for an individual layer can be changed without having to reload the other content on the page. Moreover, LAYER elements may be nested inside one another. See , for more details.

Example

<LAYER BGCOLOR="yellow" SRC="instrux.html" WIDTH=200 HEIGHT=300></LAYER>

Object Model Reference

NN	[window.]document.layerName

ABOVE

NN 4 IE n/a HTML n/a

ABOVE="layerID"

Optional

Names the positionable element that is to be above (in front of) the current LAYER in the stacking order. This is a different way to set the Z-INDEX attribute that does not rely on an arbitrary numbering system. If you use the ABOVE attribute, do not use the BELOW or Z-INDEX attribute for the same LAYER element.

Example

<LAYER ID="instrux" BGCOLOR="yellow" SRC="instrux.html" ABOVE="help1"
WIDTH=200 HEIGHT=300>
</LAYER>

Value
Case-sensitive identifier.

Default

None.

Object Model Reference

NN	[window.]document.layerName.above

BACKGROUND

NN 4 IE n/a HTML n/a

BACKGROUND="URL"

Optional

Specifies an image file that is used as a backdrop to the text and other content of the LAYER element. Unlike normal images that get loaded into browser content, a background image loads in its original size (without scaling) and tiles to fill the available layer space. Smaller images download faster but are obviously repeated more often in the background. Animated GIFs are also allowable but very distracting to the reader. When selecting a background image, be sure it is very muted in comparison to the main content so that the content stands out clearly. Background images, if used at all, should be extremely subtle.

Example

<LAYER BACKGROUND="blueCrinkle.jpg" SRC="instrux.html" WIDTH=200 HEIGHT=300>
</LAYER>

Value
Any valid URL to an image file, including complete and relative URLs.

Default

None.

Object Model Reference

NN	[window.]document.layerName.background

BELOW

NN 4 IE n/a HTML n/a

BELOW="layerID"

Optional

Names the positionable element that is to be below (behind) the current LAYER in the stacking order. This is a different way to set the Z-INDEX attribute that does not rely on an arbitrary numbering system. If you use the BELOW attribute, do not use the ABOVE or Z-INDEX attribute for the same LAYER element.

Example

<LAYER BGCOLOR="yellow" SRC="instrux.html" WIDTH=200 HEIGHT=300 BELOW="thankyou">
</LAYER>

Value
Case-sensitive identifier.

Default

None.

Object Model Reference

NN	[window.]document.layerName.below

BGCOLOR

NN 4 IE n/a HTML n/a

BGCOLOR="colorTripletOrName"

Optional

Establishes a fill color (behind the text and other content) for the entire layer rectangle. If you combine a BGCOLOR and BACKGROUND, any transparent areas of the background image let the background color show through.

Example

<LAYER BGCOLOR="yellow" SRC="instrux.html" WIDTH=200 HEIGHT=300></LAYER>

Value
A hexadecimal triplet or plain-language color name. A setting of empty is interpreted as "#000000" (black). See Appendix A for acceptable plain-language color names.

Default

Varies with operating system.

Object Model Reference

NN	[window.]document.layerName.bgColor

CLIP

NN 4 IE n/a HTML n/a

CLIP="[leftPixel, topPixel,] rightPixel, bottomPixel"

Optional

A clipping region is a rectangular view to the full LAYER content. Only content that is within the clipping rectangle can be seen on the page. The default value of the CLIP attribute is either the default size of the content or the LAYER element's width by the automatically flowing content length. Setting the CLIP attribute lets you rein in long content that might flow beyond a fixed rectangle desired for the page design.

Example

<LAYER BGCOLOR="yellow" SRC="instrux.html" CLIP="50,50" WIDTH=200 HEIGHT=300>
</LAYER>

Value
CLIP attribute values are pixel measures from the top and left edges of the element as it flows in the document. The order of values is clockwise from the left edge, around the rectangle sides: left, top, right, bottom. If you supply only two values, Navigator assumes the left and top values are zero, meaning that you wish to adjust only the right and bottom edges. Thus, a setting of "50,50" means that the clipping region is 50-pixels square, starting at the top-left corner of the layer's rectangle. If you want the same size view starting 10 pixels in from the left, the CLIP attribute setting becomes "10,0,60,50".

Default

Naturally flowing viewing area of LAYER content.

Object Model Reference

NN	[window.]document.layerName.clip.left [window.]document.layerName.clip.top [window.]document.layerName.clip.right [window.]document.layerName.clip.bottom

HEIGHT, WIDTH

NN 4 IE n/a HTML n/a

HEIGHT="length"

Optional

WIDTH="length"

Define the minimum size of the LAYER element. When you add content to the layer during initial loading, however, the attribute settings do not restrict the amount of the content that is visible along either axis. For example, if you display an image in a LAYER that is 120 pixels wide by 90 pixels high, the actual visible size of a LAYER element whose HEIGHT and WIDTH attributes are set to a smaller size expands to allow the full image to appear. The same happens to text or other content: the viewable region expands to allow all content to appear. To restrict the visible portion of the content, set the CLIP attribute.

Setting the HEIGHT and WIDTH attributes to specific sizes is helpful when you are creating a colored or patterned rectangle (via the BGCOLOR or BACKGROUND attributes) to act as an underlying layer beneath some other positioned content. Without content pushing on the edges of the LAYER, the HEIGHT and WIDTH attributes set the clipping region to their sizes.

Example

<LAYER BGCOLOR="yellow" SRC="instrux.html" WIDTH=200 HEIGHT=300></LAYER>

Value
Positive integer values (optionally quoted) or percentage values (quoted). You can reduce both values to zero to not only hide the element (which you can also do with the VISIBILITY attribute), but also prevent the element from occupying any page space.

Default

Naturally flowing viewing area of LAYER content.

Object Model Reference

NN	[window.]document.layerName.height [window.]document.layerName.width

ID

NN 4 IE n/a HTML n/a

ID="elementIdentifier"

Optional

A unique identifier that distinguishes this element from all the rest in the document. This is the identifier used as values for the ABOVE and BELOW attributes. Scripts also use the ID attribute value as the LAYER element's name for object references.

Example

<LAYER ID="oldYeller" BGCOLOR="yellow" SRC="instrux.html" WIDTH=200 HEIGHT=300>
</LAYER>

Value
Case-sensitive identifier.

Default

None.

Object Model Reference

IE	[window.]document.layerName.name

LEFT, TOP

NN 4 IE n/a HTML n/a

LEFT="pixelCount"

Optional

TOP="pixelCount"

Define the positioned offset of the left and top edges of the layer relative to the spot in the document where the LAYER element would normally appear in source code order. This precise location relative to the page varies unless you also set the PAGEX and PAGEY attributes, which absolutely position the element in the document space. Unlike what it does for the ILAYER element, Navigator does not preserve the space in the document where a LAYER element appears. The element is placed in its own plane, and the surrounding source code content is cinched up--usually overlapping the LAYER content unless the layer is positioned elsewhere.

Example

<LAYER BGCOLOR="yellow" SRC="instrux.html" WIDTH=200 HEIGHT=300 LEFT=10 TOP=50>
</LAYER>

Value
Positive integer values (optionally quoted).

Default

0

Object Model Reference

NN	[window.]document.layerName.left [window.]document.layerName.top

PAGEX, PAGEY

NN 4 IE n/a HTML n/a

PAGEX="pixelCount"
PAGEY="pixelCount"

Optional

To truly position a LAYER element with repeatable accuracy, you can use the top-left corner of the document (page) as the point of reference. When you set the PAGEX and/or PAGEY attributes, you establish an offset for the left and top edges of the LAYER element relative to the corresponding edges of the entire document. Therefore, the zero point for a vertically scrolled page may be above the visible area of the browser window.

Example

<LAYER BGCOLOR="yellow" SRC="instrux.html" WIDTH=200 HEIGHT=300 PAGEX=50 
  PAGEY=350>
</LAYER>

Value
Positive integer values (optionally quoted).

Default

0

Object Model Reference

NN	[window.]document.layerName.pageX [window.]document.layerName.pageY

SRC

NN 4 IE n/a HTML n/a

SRC="URL"

Optional

To load the content of an external HTML file into a LAYER element, assign the URL of that file to the SRC attribute. Any HTML content between the LAYER start and end tags is rendered on the page after the content is loaded from the SRC URL. If you omit the SRC attribute, only content between the tags is rendered. Scripts can change the corresponding object property (src) after the document has loaded to dynamically change content within the LAYER element (without reloading the main document).

Example

<LAYER BGCOLOR="yellow" SRC="instrux.html" WIDTH=200 HEIGHT=300</LAYER>

Value
A complete or relative URL.

Default

None.

Object Model Reference

NN	[window.]document.layerName.src

TOP



See LEFT.

VISIBILITY

NN 4 IE n/a HTML n/a

VISIBILITY="visibilityConstant"

Optional

Determines whether Navigator displays the LAYER element. The default behavior is for a layer to inherit the VISIBILITY attribute of its next outermost (parent) layer. For a LAYER element that is part of the basic document body, this means that the layer is seen by default (the base layer is always visible). To hide a layer when the page loads, set the VISIBILITY attribute to "hidden". You need set the attribute to "show" only if the LAYER element is nested within another LAYER (or ILAYER) whose VISIBILITY value is set to (or is inherited as) "hidden".

Example

<LAYER BGCOLOR="yellow" SRC="instrux.html" WIDTH=200 HEIGHT=300 
PAGEX=50 PAGEY=350 VISIBILITY="hidden">
</LAYER>

Value
One of the accepted constants: hidden | inherit | visible

Default

inherit

Object Model Reference

NN	[window.]document.layerName.visibility