Managing Space on a Dynamic Page

  1. Add a rectangle, a text box, and an image to the page layout:

  2. In the Layout Properties panel, select HTML 4.01 in the HTML dropdown list.

  3. Place the picture over the text box.

  4. Enter the Timeline Mode.

  5. Right-click the picture, and select Add Object to Timeline option.

  6. Right-click the rectangle, and select Add Object to Timeline option.

  7. Select the Picture Layer from the Animations pane, and click its corresponding bullet from the Show column to hide it.

  8. Select the text and add it to the Timeline Editor.

  9. In the CSS Property Sheet, change the attribute for Display>Visibility to hidden.

  10. Right-click the first frame of the Text Object Layer.

  11. Select the Label option.

  12. Specify that the text object is hidden at the beginning of the animation.

  13. In the Text object layer, right-click frame 50, and select Insert Keyframe option.

  14. Right-click the second keyframe.

  15. From the context-menu, select Label.

  16. Enter a new label: "Now Visible."

  17. Expand the Object’s Layer.

  18. Display the Picture object.

  19. Make sure the Playhead is positioned to frame 50 and drag the picture beneath the text box.

  20. Exit the Timeline Mode.

  21. In Page Design, select the rectangle, and click the Set Timeline action button.

  22. Set the timeline action for Clicked, Animation 1 to Play.

The result can be seen when you publish or preview your page.