Opening the Menu

Now that we have created all the symbols we need, let's get on the stage. Proceed as follows:

1. Select Edit > Edit Movie.
   
   
2. From the library, drag the DropdownMenu symbol onto the stage and position it as you wish.
   
   

Now it's time to add some interactivity to the menu. This one will be double:

• A click on the main button will display the three menu item buttons.
  
  
• A click on one of these three buttons will display the desired page and make the buttons invisible.
  
  

Let's begin by displaying the three buttons:

1. In the library, double-click on the DropdownMenu icon in order to enter the symbol editing mode.
   
   
2. The DropdownMenu movie clip contains two images: one for the inactive state (only the main button is visible) and one for the active state (the three menu item buttons are also visible).
   
   
3. Click on frame 1 in the timeline to activate it.
   
   
4. Double-click on the button background on the stage.
   
   
The Instance Properties dialog box appears.


5. Activate the Actions tab, then click on the button denoted by a plus sign ("+") and select the On MouseEvent option in the list.
   
   
This option defines that the event to be considered is of the mouse type.


6. In the right-hand side of the dialog box, check the Press option.
   
   
In this way, you indicate that the event to be associated with an action is pressing a button.


7. Click again on the "+" button and select Go To.
   
   
8. Enter 2 in the field Number (in the right-hand side of the dialog box).
   
   
9. The DropdownMenu movie clip will move to frame 2 (which keeps the menu open) when the user clicks on the main button.
   
   

Figure 4: When the user clicks on the button, the movie clip displays frame 2

To avoid displaying frame 2 of the clip when it is played back (i.e. automatically after frame 1 is displayed!), you must block the animation on frame 1:

1. Double-click on frame 1 in the timeline.
   
   
2. Activate the Actions tab, then click on the button denoted by a plus sign ("+") and select Go To in the list.
   
   
3. Enter 1 in the Number field.
   
   
Frame 1 will be read in a loop until the user clicks on the main button.