Creating an Invisible Button

I l @ ve RuBoard

You don't actually have to place a graphic in every frame of a button. The only frame that must have content is the Hit frame, because it describes the active button area. Buttons without content in the Up, Over, and Down frames are invisible in the final movie. A common use for an invisible button is to resume playback of a movie that pauses on a frame that contains lots of text. Make an invisible button with a Hit-frame graphic that covers the whole Stage, and give the button a play action; then place the button in the paused movie frame. When viewers finish reading your text, they can click anywhere in the frame to resume playback of the movie.

To create an invisible button:

Open a new copy of the ObjectActions Template that you created earlier.
In the Contents layer, in Keyframe 1, delete all the items on the Stage.
Using the text tool, place a long text block in Keyframe 1 of the Contents layer (Figure 13.31).

Figure 13.31. Your practice file should look something like this: a five-frame, two-layer movie with lots of text in the Content layer's first frame and a stop action in the first frame of the Actions layer.
With Frame 1 selected, choose Insert > New Symbol.

The Create New Symbol dialog box appears.
Type a name for your button, choose Button in the Behavior section, and click OK.
In symbol-editing mode, in the Timeline for your button, select the Hit frame.
Choose Insert > Blank Keyframe.
Use the rectangle tool to create a filled rectangle large enough to cover the entire Stage (Figure 13.32).

Figure 13.32. To make an invisible button, create a button symbol that has nothing in the Up, Over, and Down frames. Here, the Hit frame contains a filled rectangle large enough to cover the Stage.

This solid rectangle turns the whole Stage into an active button, but because no graphics are associated with the button, it will be invisible to the user .
Return to movie-editing mode, and drag a copy of your button to the Stage.

Flash shows a transparent object that previews the hot-spot area. If necessary, you can reposition (or resize) the button so that it covers the Stage fully (Figure 13.33).

Figure 13.33. When the Up frame of a symbol is empty, Flash displays a transparent version of the Hit-frame graphic to help you position your invisible button in movie-editing mode.
On the Stage, select the hot-spot preview.
Access the Actions-Button panel.
Assign a play action to your button instance (as described in "Adding Actions to Buttons" earlier in this chapter).

You're ready to see the button in action.
Choose Control > Test Movie.

Flash exports the movie and opens it in Flash Player. Playback pauses on Frame 1the one with lots of text (Figure 13.34). But as soon as you click within the current frame in the Player window, Flash moves to Frame 2 and plays through the rest of the frames in the movie.

Figure 13.34. This movie is paused on a frame with a stop action and an invisible button that covers the entire Stage. The index-finger pointer indicates the presence of the button. Clicking takes the user to the second frame and resumes playback of the movie.

Tips

In symbol-editing mode, the Stage is a fixed size (20 inches by 20 inches), and it's not necessarily the same size as the Stage in your current movie. To make sure that your Hit-frame rectangle covers the whole Stage in the movie, select the rectangle and access the Info panel. In the Width and Height fields, enter values that are slightly larger than the dimensions of your movie.
For frames that contain movie clips, you can skip creating an invisible button and attach an ActionScript that responds to mouse events to the movie clip itself (see "Adding Actions to Movie Clips" later in this chapter).

I l @ ve RuBoard

Figure 13.31. Your practice file should look something like this: a five-frame, two-layer movie with lots of text in the Content layer's first frame and a `stop` action in the first frame of the Actions layer.

Figure 13.32. To make an invisible button, create a button symbol that has nothing in the Up, Over, and Down frames. Here, the Hit frame contains a filled rectangle large enough to cover the Stage.

Figure 13.33. When the Up frame of a symbol is empty, Flash displays a transparent version of the Hit-frame graphic to help you position your invisible button in movie-editing mode.

Figure 13.34. This movie is paused on a frame with a `stop` action and an invisible button that covers the entire Stage. The index-finger pointer indicates the presence of the button. Clicking takes the user to the second frame and resumes playback of the movie.

Creating an Invisible Button

Figure 13.31. Your practice file should look something like this: a five-frame, two-layer movie with lots of text in the Content layer's first frame and a stop action in the first frame of the Actions layer.

Figure 13.32. To make an invisible button, create a button symbol that has nothing in the Up, Over, and Down frames. Here, the Hit frame contains a filled rectangle large enough to cover the Stage.

Figure 13.33. When the Up frame of a symbol is empty, Flash displays a transparent version of the Hit-frame graphic to help you position your invisible button in movie-editing mode.

Figure 13.34. This movie is paused on a frame with a stop action and an invisible button that covers the entire Stage. The index-finger pointer indicates the presence of the button. Clicking takes the user to the second frame and resumes playback of the movie.

Figure 13.31. Your practice file should look something like this: a five-frame, two-layer movie with lots of text in the Content layer's first frame and a `stop` action in the first frame of the Actions layer.

Figure 13.34. This movie is paused on a frame with a `stop` action and an invisible button that covers the entire Stage. The index-finger pointer indicates the presence of the button. Clicking takes the user to the second frame and resumes playback of the movie.