Nesting
Nesting is creating layer(s) within another layer. Place cursor in layer and choose Layer command.

Have a look at Layers3 for an example of this.

Understanding Layers - 2

Setting Layer attributes - use Property Inspector to set most layer properties

Manipulating Layers

(1) Selecting and Positioning

Click on the layer and then pick up using positioning handle. To select multiple layers use section handle with SHIFT.

(2) Editing

Click on the edges and use the handles to resize. Do not click on Prevent Overlaps unless you are intending to convert into table (where edges cannot overlap)

(3) Add Colour or Image to Layer

You can use an image as background by selecting in Property Panel. If image is smaller than the layer it will tile. Use colour picker to select background colour.

(4) Overflow and Clip
Overflow is what happens if content is too big for layer.'Visible' expands layer so you can see content, 'Hidden' means extra will not display,'Scroll' explains itself.
Clip defines the visible area.
See explanation of this

(5) Stacking Order
If you have layers stacked on top of each other you need to tell Dreamweaver the order in which they lie. This is Z-Index.(it is an extension oy X,Y co-ordinates used for positioning graphics) This is position relative to screen and viewer. Set in Property Inspector. The top layer has highest index.

How to Use Layers to design a table

If you want a complex layout design use layers.

1. Create a layout entirely of layers Use GRID and Snap to Grid. Also set the property in Layers Panel to Prevent Overlaps.
2. Go to Modify menu and select Convert and then Layers to Table.
3. Have a look at the dialogue box options by selecting dialogue box

This whole page was laid out like this!

Use Layers Interactively and with HTML Style

(1) CSSSTYLE - Cascading Style sheets are explained fully in a separate section, but 'Positioning a Panel' is one of the custom style settings you can apply to your pages. This means setting up a common posioning, visibility and stacking order for all layers.

(2) Interactive Use of Layers

This topic is also covered as part of 'behavoiurs' in a separate section. It is useful for your layers to be interactive. 'Show-Hide Layer' is one of the dreamweaver behaviours that can be set and triggered in a certain way. On the Layers3 page there is an example where two adverts (Special Offers 2 & 3) when activated open up 2 hidden layers. This is done like this:

1. Create a new layer and name it. Put something in it or colour the background to make it visible.
2. Hide the layer by changing its visibility index.
3. Create a text link to the layer by typing the opening instruction somewher outside the layer and giving it a # as a link.(this is called a null hyperlink).
4. Open the Behaviours Panel. Click on your hyperlink.
5. Click on the + button in behaviours and select Show-Hide Layers from the menu.
6. Select your page on the dialogue box and also select 'show'. Click OK to save.
7. Your selected action will appear in the actions column of the Behaviours Panel. You can change 'on click' by selecting the drop down events menu if you wish.
8. Save page and preview.

Navigation: Layers 3     Home