type = 'application/x-shockwave-flash'
data = 'http://sitepointstatic.com/flash/pathtween.swf'
width = '400'
height = '400'
bgcolor = 'black'
>

Motion guide layers let you draw paths along which tweened instances, groups, or text blocks can be animated.

You can link multiple layers to a motion guide layer, and have multiple objects follow the same path. A normal layer that’s linked to a motion guide layer becomes a guided layer.

To create a motion path for a tweened animation, download the sample files here, then follow these steps:

1. Create a motion-tweened animation sequence.

2. Select the animation layer. Right-click and choose Add Motion Guide from the Context menu.

1179_0

3. Use the pen tool to draw the path you want your tween to follow.

4. Snap the center to the beginning of the line in the first frame of the animation layer, and to the end of the line in the last frame.

1179_1

1179_2

That’s all it takes. Test the movie to see your shape tween!

Georgina has more than fifteen years' experience writing and editing for web, print and voice. With a background in marketing and a passion for words, the time Georgina spent with companies like Sausage Software and sitepoint.com cemented her lasting interest in the media, persuasion, and communications culture.

Get your free chapter of Level Up Your Web Apps with Go

Get a free chapter of Level Up Your Web Apps with Go, plus updates and exclusive offers from SitePoint.


No Reader comments

Related books & courses
Available now on SitePoint Premium

Preview for $1