Learn how to create a Flash actionscript button using actionscript controlled tweening and Movieclips in Flash. This Flash button tutorial uses concepts of Movieclips and Tweened Animations.

Compatible Versions of Flash for this Tutorial

Flash MX 2004 & below | Flash 8 | Flash CS3 | Flash CS4
Note: For uses of lower versions of Flash some visual interface images would differ.
Recommended Version: Adobe Flash CS4 Professional

You Are Here ::: Home >> Free Tutorials >> Flash Tutorials >> Advanced Buttons

Create a Flash ActionScript Button

Steps to create this actionscript button effect (can be used for website links):

Open the new flash document.
Create a button and name this instance as Button then go to symbol-editing mode.
Add new layer, draw the simple button and convert in to movie clip symbol (pressF8) then go to symbol editing mode.
Press F6 or (right click >> insert key Frame) on 10th and 20th frame and then reduce that alpha value at 1st and 20th frame.
Select middle of the frame between 1-10 then go to property panel, select shape tween from that pop up. Do the same process between 10-20th frame.
Add new layer above the tweening layer then press F6 (right click >> insert key Frame) on 10th and 20th frame.
Select 1st frame then go to action panel (press F9) stop this action, similarly do that process on 10th and 20th frame.
Go to button editing mode,add new layer, name this layer as text, and make sure that text layer always above the movie clip layer.
Go to scene1, and select the button then press F9, copy and paste the following code.

on (rollOver)
{
_root.Button.instance1.gotoAndPlay (2);
} on (rollOut)
{
_root.Button.instance1.gotoAndPlay (11);
}

Ctrl+Enter

We would love to hear your comments and any suggestions on future tutorials we can add to this section. Thanks!

Bookmark & Share

Bookmark and Share this web page.