Step 8: Adding the Behaviors

Now, we want to add the behaviors to each of the links in the menu so that when we mouse over each link, the appropriate image appears.

1. Double click inside the "Apple" link up top to select it.
2. before we can add the behavior, we need to create a null link.
3. You do this by typing the # sign in the link window. For more on null links, click here.
4. Go over to the Behaviors Palette and click the plus (+) sign.
5. From the drop down menu, select Show-Hide Layers.
6. Here you'll see the four layers you created for your 4 images.
7. Click the "apple" layer and then click "Show" to show the layer. Click OK.
8. Next, let's change the "OnClick" to "OnMouseOver". We need to add the "OnMouseOut" behavior to the link so that when you remove your mouse from the "apple" link, the apple image disappears.

9. Click the plus sign (+) again and select Show-Hide Layers again.
10. Again select the Apple layer, this time selecting "hide" from the buttons on the bottom. Click OK.
11. Next, change the action "onClick" to onMouseOut.

Step 9: Testing your Behaviors

1. Let's do a quick Preview In Browser to see if it's working.
2. After you see it looking good, go ahead and repeat steps 12-20 for your remaining images.

Here's how your Layers Palette should look for the 4 images:

Home | Dreamweaver | Fireworks | Flash | Photoshop | Elements | PowerPoint| Ebay | QuickTime Pro | Flash 5 CD | Fireworks MX CD | QuickTime Support | Contact

Copyright © 1999-2011 CBT Cafe, All rights reserved

Flash®, Fireworks™, and Dreamweaver® are registered trademarks of Macromedia, Inc. in the United States and/or other countries
Photoshop®, Photoshop Elements® and Illustrator® are registered trademarks of Adobe Systems, Inc.
QuickTime® is a registered trademark of Apple Computer, Inc.
Ebay® is a registered trademark

CBT Cafe | Multimedia Learning | Interactive Graphics