Click here to see a live example.
Part1: Setting up Dreamweaver.
Open Dreamweaver, create a new page, Basic page Html. Copy the code below and paste it into Dreamweaver. This is the code for the table, you don't necessarily need the table but its good because it organize it a little.
With the code pasted into Dreamweaver Code view you should have the table shown below.
Next add the numbers 1 and 2 into the two small square boxes as shown below.
Double click on the number "1" text to highlight it, when you do that the properties panel should show up at the bottom of the window. You should see the Link bar shown below, type in the # symbol. Repeat this for the second number.
Click outside the table, Next click on Insert Layout Objects Layers
When you do that the layer below will come up.
With the layer selected, change the Layer ID to "layer1"
Next change the layer Vis to Hidden
Next position the layer as shown below.
With the layer selected, Type something into the layer as shown below.
Repeat this step for the second number 2
Double click on the number "2" text to highlight it, when you do that the properties panel should show up at the bottom of the window. You should see the Link bar shown below, type in the # symbol. Repeat this for the second number.
Click outside the table, Next click on Insert Layout Objects Layers
When you do that the layer below will come up.
With the layer selected, change the Layer ID to "layer2"
Next change the layer Vis to Hidden
Next position the layer as shown below.
With the layer selected, Type something into the layer as shown below.
Next click on Windows behaviors, the behaviors tab have to be checked. With that the behaviors tab should come.
Click on the number "1" to select it. Click on the (plus +) icon and click on Show-Hide Layers with that hide and show the layers as shown below.
Click on the number "2" to select it. Click on the (plus +) icon and click on Show-Hide Layers with that hide and show the layers as shown below.
Finished:
Well that is it. Hope it is what you expected. If you have, any questions or comments feel free to e-mail me or leave a message on the forum. If you are having a hard time with the tutorial email me and I will try to help.
This Tutorial was Created By Mark
© 2007 pixeldigest.com. All Rights Reserved. |