Home / Articles / Adding Basic Interactivity in Adobe Edge Animate

Adding Basic Interactivity in Adobe Edge Animate

Article Description

Learn how to use Adobe Edge Animate’s built-in code snippets and intuitive panels to add actions to create engaging, user-driven, interactive experiences.
Customizing the mouse cursor

Customizing the mouse cursor

In addition to the visual feedback that you can provide by changing the appearance of the button when the user interacts with it, you can also change the appearance of the cursor itself. Often, the default arrow cursor on a desktop or laptop browser changes to a hand (known as the pointer cursor) when it hovers over an interactive element or hyperlink. You can choose to change the cursor to a pointer, or choose from among dozens of other cursor types.

Using the pointer

The Properties panel controls the cursor appearance and allows you to select a custom icon for each element.

  1. In the Timeline panel, temporarily turn the Display property for the five colorized thumbnail elements to On.
  2. Turning on the Display property allows you to select them on the Stage.

  3. Select all five colorized thumbnail elements, button1_color through button5_color.
  4. In the Properties panel, click the Cursor option and choose the pointer icon.
  5. Turn the Display property for the five colorized thumbnail elements back to Off.
  6. The colorized thumbnail elements are hidden again.

  7. Preview your Edge Animate composition in a browser by choosing File > Preview in your browser or pressing Ctrl+Enter (Windows)/Command+Return (Mac OS).
  8. The pointer cursor appears whenever you move your mouse over or click on the buttons.
12. Controlling animated elements | Next Section Previous Section