Read this action script 3 lesson and learn how to create jet ski alpha vibro animation using some special flash tricks. This animation can be used for any web site as banner or for some presentation. Using this lesson You will also learn how to create instance name, how to apply action script code on any photo, how to create motion tween and much much more. Let's start!

Example:



Step 1

First, save the photo below that we will use for this lesson.





Step 2

Create a new flash document. Press Ctrl+J key on the keyboard (Document Properties) and set the width of your document to 400 pixels and the height to 250 pixels. Select any color as background color. Set your Flash movie's frame rate to 77 and click ok.

Step 3

Call the current layer photo. Double-click on its default name (Layer 1) to change it. Press Enter once you have typed in the new name!

Step 4

Choose now File > Import > Import to stage (Ctrl+R) and import a photo that you just saved in step 1 into a flash stage. While the photo is still selected, go to the Align Panel (Ctrl+K) and do the following:

1. Make sure that the Align/Distribute to Stage button is turned on,
2. Click on the Align horizontal center button and
3. Click the Align vertical center button.



Step 5

While the photo is still selected, hit F8 key (Convert to Symbol) to convert it into a Movie Clip Symbol.



Step 6

Click on frame 10 and 20 and hit F6 key.

Step 7

While you're still on frame 20, select the Selection Tool (V) and click once on the photo to select it. Then, go to the Properties Panel (Ctrl+F3) below the stage. You will see the Color menu in the Properties Panel. Select Alpha in it and put it down to 0%.



Step 8

Right-click anywhere on the gray area between frame 1 and 10 and frame 10 and 20 on the timeline and choose Create Motion Tween from the menu that appears.

Step 9

Select frame 10 of layer photo and hit Ctrl+C key (Copy).

Step 10

Create a new layer above the layer photo and name it photo 1.

Step 11

Select the first frame of layer photo 1 and hit Ctrl+Shift+V key (Paste in Place).

Step 12

Select again the Selection Tool (V) and click once on the photo to select it. Then, go to the Properties Panel below the stage. On the left side, You will find the Instance name input field there. Call this Movie Clip photo_mc. See the picture below!



Step 13

Select the first frame of layer photo and go to the AS panel (F9). Then, enter this code inside the actions panel:

var posx:Number = photo_mc.x;
var posy:Number = photo_mc.y;
photo_mc.addEventListener(Event.ENTER_FRAME, shakeIt);
function shakeIt(event:Event):void {
photo_mc.x = posx+(Math.floor(Math.random()*18));
photo_mc.y = posy+(Math.floor(Math.random()*18));
photo_mc.rotation = Math.random()*18;
} 

We're done!

Test your animation and enjoy!

Download source file (fla)

Have questions about this tutorial? Visit our friendly Community Forums!