Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Design > Adobe Creative Suite

  • Print
  • + Share This
  • 💬 Discuss
This chapter is from the book

Invisible Buttons

You can exploit the flexibility of Flash button symbols by defining only particular states. If you leave empty keyframes in all states except for the Hit state, you create an invisible button circle-a.jpg. An invisible button is not visible to the audience, yet still maintains a clickable hot spot. Invisible buttons are extremely useful for creating generic hotspots to which you can assign actions. By placing invisible button instances on top of graphics, you essentially have the power to make any area on the Stage react to the mouse pointer. For example, you can place several invisible buttons over a map graphic to create hidden hotspots circle-b.jpg.

When you drag an instance of an invisible button onto the Stage, you see the hit area as a transparent blue shape, which allows you to place the button precisely. When you choose Control > Enable Simple Buttons (Ctrl-Alt-B for Windows, Cmd-Option-B for Mac), the button disappears to show you its playback appearance.

To create an invisible button

  1. Choose Insert > New Symbol (Ctrl-F8 for Windows, Cmd-F8 for Mac).

    The Create New Symbol dialog box appears.

  2. Type the symbol name of your button, choose Button as the Type, and click OK.

    A new button symbol is created in the Library, and you enter symbol-editing mode.

  3. Select the Hit keyframe.
  4. Choose Insert > Timeline > Keyframe (F6).

    A new keyframe is created in the Hit state.

  5. With the Hit keyframe selected, draw a generic shape that serves as the hotspot for your invisible button circle-c.jpg.
  6. Return to the main Timeline.
  7. Drag an instance of the symbol from the Library onto the Stage.

    A transparent blue shape appears on the Stage, indicating the Hit state of your invisible button circle-d.jpg.

  8. Move, scale, and rotate the invisible button instance to cover any graphic.

    When you choose Control > Enable Simple Buttons, the transparent blue area disappears, but your pointer changes to a hand to indicate the presence of a button.

  9. Give the button instance a name in the Properties inspector and assign an event listener for it in the Actions panel as described in the previous tasks.
  • + Share This
  • 🔖 Save To Your Account

Discussions

comments powered by Disqus