Search
Clear search
Close search
Google apps
Main menu

Add event markers and event labels to the timeline

The Events track, found at the top of the timeline in Advanced mode, is where you connect timeline animation to events with event markers and event labels. Event markers let you trigger events at specific points in the timeline, and event labels let you set up events that control the animation.

Event markers 

Timeline-based events are set using event markers on the Events track. When the animation playhead reaches the event marker in the timeline, the event is triggered.

Events are not triggered during animation preview or scrubbing. You can test events by previewing your ad or webpage.

To add an event marker to the Events track:

Use one of the following methods:

  • Right-click the Events track where you want to add the event marker, and select Add event from the pop-up menu.
  • Click the timeline or otherwise move the playhead to where you want to add the event marker, and click the Add event button  on the Events track.

To add an event to an event marker:

Use one of the following methods:

  • Double-click the event marker. The Events dialog will open to the action selection step.
  • In the Events panel, click the Add event button  to open the Events dialog for a new event. For the target, select the parent of the animated element (usually the page), and for the event, select the event marker.

To remove an event marker:

Right-click the event marker you want to remove and select Remove event from the pop-up menu. This action also deletes any events that were triggered by that event marker.

To rename an event marker:

  1. Right-click the event marker you want to rename and select Edit event name... from the pop-up menu.
  2. Enter the new name in the pop-up dialog.
  3. Press Enter.

To move an event marker:

Drag the event marker to a new location on the timeline.

Event labels 

Event labels are named locations on the timeline. If you want to use an event to send the playhead to a specific point on the timeline, you need to give that keyframe a label.

To add an event label to the Events track:

Use one of the following methods:

  • Click the timeline or otherwise move the playhead to where you want to add the label, then click the Add label button  on the Events layer. Google Web Designer will assign a generic label name.
  • To specify a label name:
    1. Right-click the Events track where you want to add the label and select Add label... from the pop-up menu.
    2. Enter a label name in the pop-up dialog.
    3. Press Enter.

To remove an event label:

Right-click the label you want to remove and select Remove label from the pop-up menu. This action also deletes any events configured to use that event label.

To rename an event label:

  1. Right-click the label you want to rename and select Edit label... from the pop-up menu.
  2. Enter the new name in the pop-up dialog.
  3. Press Enter.

To move an event label:

Drag the event label to a new location on the timeline.

Actions

The following animation actions can be triggered by other events:

Action Configuration options
pause none
play none
togglePlay none
gotoAndPlay Label - The event label the animation should start from.
gotoAndPlayNTimes
  • Label - The event label the animation should start from.
  • Repeat - The number of times the animation should loop.
gotoAndPause Label - The event label the animation should start from.
Was this article helpful?
How can we improve it?