Adobe CS5 Dreamweaver AP Div Behaviors - dummies

By Jennifer Smith, Christopher Smith, Fred Gerantabee

To add cool effects and serious interactivity, you can use the built-in Adobe Creative Suite 5 (Adobe CS5) Dreamweaver behaviors, a collection of ready-to-use scripts that you can apply to boxes, form elements, text, and images on a page. Used with boxes (AP Divs), behaviors can enhance them with special effects or mouse interaction (such as clicks and rollovers) to make the page more exciting.

The Behaviors panel features a whole new set of effects, such as Fade/Appear, Shrink, Highlight, Slide, and more — all of which you can apply to the AP Divs you create.

  1. Choose Window→Behaviors to open the Behaviors panel.

  2. Select a box by using the AP Elements panel or select a box directly on the stage.

  3. In the Behaviors panel, click the plus sign.

    The menu of available behaviors appears.

  4. From the menu, choose the behavior you want to apply.

    For example, to apply a fade effect, choose Effects→Appear/Fade. The Appear/Fade dialog box opens.

  • Make sure the effect is set to Fade and select the Toggle Effect check box to make sure the box reappears when it’s clicked a second time. Then click OK.

    The behavior is added to the list. The phrase onClick to its left indicates that this action occurs when the box is clicked.

  • Choose File→Save to save the page.

    To see the effect in action, preview the page in a browser.

  • Choose File→Preview in Browser and pick a browser to launch the page.

    When you test the page, clicking the box makes it disappear or reappear — lots of fun for you and highly interactive for users!

  • If your browser is restricting the web page from running scripts or ActiveX controls, click the message at the top of the browser window and select Allow Blocked Content to properly test the new behaviors.

    When effects behaviors are used, Dreamweaver needs to copy to your local site several files that make the effects possible.