Home Community Submit Tutorials Downloads Gallery Links Contact FAQ's / Help
  Home
  Submit Tutorials
  Community
  Tutorials
  Fonts
  Templates
  Affiliates
  Photography Corner
  Site Map
  Contact Us
 
Affiliates
  Pixel Apex
  Trick Digest
  Racuda
  Adobe Tutorialz
  Pixel2life
  Good-Tutorials
  Tutorialized
  Deviantart
  Majesticlicks
  Free-Brushes
 
Tutorial Categories
3D Studio Max
Adobe Photoshop
Adobe Fireworks
Adobe Flash
Adobe Flex
Adobe Illustrator
ASP.NET
Dreamweaver
eCommerce
Gimp
JavaScript
Maya
Microsoft Frontpage
PHP Coding
Swift 3D Swift 3D
Windows Operation
Wordpress
 
Tutorial
Name:
Image Quality
Author:
Trick Digest
Tutorial
Name:
Opened Envelope
Author:
Pixel Digest
 
Search:
Search Example: Orb, Oman3d, Adobe Photoshop or Picture Editing
 
 
Hide/Show Layers  - Learn how to create this effect using behaviors.
Introduction: In this tutorial I will explain how to create the show/hide menu shown. If you would like to see a live demonstration click here. To create this tutorial I used Dreamweaver 8, and added the show/hide behavior which is built into Dreamweaver. It is a simple process that gives you a nice effect.
 

  

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.

 
 
Help Support Us
 
 
 
News Updates
Updated the Forum, Unfortunately i could not use the same link as the old forum for the update. For the new link click Here. All the post and user name are still usable. So, if you previously registered you can still use the old username and password. Some accounts that was not used were deleted.  
 
News Update [10/16/07]
Yesterday on the 15th of October my gallery went down for some unknown reason. I was able to get the backup of the images, i just lost all the users. The gallery was not that active but i am sill pissed about what happened. I am in the process of reloading the gallery. Just give me some time and it should be up and running.Yesterday on the 15th of October my gallery went down for some unknown reason. I was able to get the backup of the images, i just lost all the users. The gallery was not that active but i am sill pissed about what happened. I am in the process of reloading the gallery. Just give me some time and it should be up and running.  
... Read More
 
Bookmark This Page
 
 
Untitled Document
Latest Gallery Image
 
Sponsors
Custom Shapes
Custom Shapes
Custom Shapes
 
 

Home | Submit | Tutorials | Forums | Gallery | Fonts | Downloads | Templates | Affiliates | Sitemap | Contact | FAQ's / Help

© 2005 - 2008 pixeldigest.com