Create an Invisible Button in Flash Professional CS3

In this tutorial, we will add an invisible button to our Flash^R website. Invisible buttons are easy to make in Flash because there are no visible characteristics to add to the button states. You need only to designate the clickable area for the button in the Hit frame of the button's Timeline.

As you remember, a Flash button has four button states. They are Up, Over, Down and Hit. The Up state is the inactive state where the button is just sitting there on the webpage. The Over state is when the mouse is over the button and the Down state is when the button is clicked. The Hit state is invisible when the movie is playing. Its only purpose is to designate the clickable area for the button.

Open your Flash movie and lets make an invisible button.

Let's put the invisible button (or buttons) on their own layer in the Timeline. Click the Insert Layer button in the Timeline and name the new layer "InvButtons".

Now we are ready to make our master button. Then we will place an instance of the master button on the Stage over the computer. Remember from the last tutorial, we built an animation for the computer screen. Now we will put an invisible button on top of that same area but on a different layer.
Click Insert, New Symbol to make a new button symbol. In the Create New Symbol dialog box, name the new button symbol "InvButton" and set the Type of symbol to Button.

When you click OK the Stage will disappear and the workspace will change to the edit mode for our new button. The workspace is now all white with a small plus sign in the center. You will also notice that our master button has been added to the Library and there is a new Timeline for our master button which has the four button states.
The default name for the first layer in the new Timeline is Layer 1. Change this to ButtonAni or anything you wish.
We need to add a rectangle over the plus sign which will tell Flash the size of the clickable area for this button. I used an 85 x 85 pixel rectangle but you may wish to use a smaller or larger size.

Click on the Hit frame in the Timeline and click Insert, Timeline, Keyframe. Use the Rectangle tool to draw a rectangle and center it over the plus sign. The Fill color can be set to any color. It will not be visible when the movie plays.
Click on Scene 1 in the Edit Bar to return to the main movie.
Click on Frame 1 of the InvButtons layer. Now drag an instance of our new master button from the Library to the Stage and place it over the computer. It will appear to be a bright blue color to indicate that there is an invisible button in that location on the Stage but this will not be visible when the movie plays.
In the Properties Inspector, I gave the button an Instance Name of "EmailButton" because I will program the button to open an email window.
To test our button, click Control, Test Movie. When the movie plays and you move your mouse over the computer, the mouse pointer should change to a hand indicating that this area is now a button.
Save your movie.