UltimateUIDocs
Archived upstream docs · Features depend on the installed plugin version; not all features have been verified.

UltimateUI guide

Animation tool

This guide shows how the Animation tool works.

The Animation Tool allows you to animate any elements on your page.

After selecting the Animation Tool, a timeline will appear at the bottom of the editor where you can add keyframes. Each keyframe defines what the object will do between the previous and the next one.

To make an object move from one position to another, select the object, move the timeline to second 0 (the start of the timeline), and click the + next to Position. This will add the first keyframe on the timeline.

To add the next keyframe, move the timeline to second 1 using the arrow or by clicking directly on it. Once you’ve set the gap between the first and second keyframe, you can click + again to add it. Now that the second keyframe has been added, you can move the object to a different position. The animation path will be shown using dots. As you move the timeline, you will also be able to preview how the animation looks.