Share this Page URL

Lesson 8. Creating Animations > Adding actions to animations - Pg. 191

Creating Animations 191 Select the second keyframe in that track, enter 1 for Depth, and press Enter or Return. The lower depth will put the Dragonfly floating box behind the reeds beginning at this keyframe. 7. Select the last keyframe for the track of the Dragonfly floating box, enter 3 for Depth, and press Enter or Return. This places the Dragonfly floating box in front of the reeds in the stacking order. 8. Play the animation. Notice that the dragonfly now seems to circle the reeds, first passing in front of and then passing behind them. 9. Stop the animation, and choose File > Save. 10. Close the Timeline Editor and close the Haiku.html file. 6. Adding actions to animations Actions are premade scripts that let you trigger events and control different processes on the page. Actions can be attached to text, images, and floating boxes. You can use actions to control transition effects for animated floating boxes, and to control which animations play on a page. (For more information on actions, see Lesson 9, "Using Actions and JavaScript." ) In this part of the exercise you'll add actions to two animated floating boxes on the Prince.html page (the last link off the Poetry Sampler page). The floating boxes contain a poem and a poem title. When the page loads, the boxes are invisible. As the animation runs, the title box appears and moves to the right, and then the poem appears. The actions you add will make both boxes appear more gradually on the page. 1. Double-click the Prince.html file in the Pages folder in the site window to open the Web page.