Step 1

Draw the green rectangle, you can do this either on the time line or using ActionScript, I will do this with ActionScript (if you want to do this on the time line just draw the rectangle, convert it to the symbol and give it a “button” instance name).

//first we create the Sprite which will be our button
var button:Sprite = new Sprite();
// the we draw a green rectangle inside of it
button.graphics.beginFill(0x00FF00, 1);
button.graphics.drawRect(0, 0, 100, 50);
button.graphics.endFill();
// then we add the button to stage
this.addChild(button);

Step 2

We will have to set some very important properties of our Sprite (for those of you who draw the button on the time line you have to fallow the code from this part), first we would like to set the buttonMode to true so that the hand cursor shows up when we roll over the button, also it’s good to set the mouseChildren property to false so that none of the objects inside of our Sprite will receive the click.

button.buttonMode  = true;
button.mouseChildren = false;

Now our button is ready, but it doesn’t do anything, in the next step we will add interactivity.

Step 3
Now we will add the events to our button so it will change after roll over/out and it will do something after the click event is triggered. For the visual “effect”  We will use Tweener

// first we add the events to our button
button.addEventListener(MouseEvent.ROLL_OVER, bOver, false, 0, true);
button.addEventListener(MouseEvent.ROLL_OUT, bOut, false, 0, true);
button.addEventListener(MouseEvent.CLICK, bClick, false, 0, true);

// next we create the functions that will handle our events
function bOver(e:MouseEvent):void {
   // we tween the alpha when user rolls over the button
   Tweener.addTween(e.target, {alpha:0.8, time:1, transition:"easeOutExpo"});
}
function bOut(e:MouseEvent):void {
  // after roll out the alpha it tweened back to 1
  Tweener.addTween(e.target, {alpha:1, time:1, transition:"easeOutExpo"});
}
function bClick(e:MouseEvent):void {
   // when user clicks we will redirect him to my profile on ActiveDen website
   navigateToURL(new URLRequest("http://bit.ly/7I3xBb"), "_blank");
}

If you are missing any imports here is the list of those that you need to include in the ActionScript:

import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.net.navigateToURL;
import flash.net.URLRequest;

import caurina.transitions.*;

Download Source simple-button.zip