top of page
Hello Animations

Hello Animations

Get started with animations.

Intermediate.png

Beginner

6K

Published:

February 26, 2023

Girl Enjoying her Drink

by

Anchor 1
Hire a Developer

Example Description

In this example, we demonstrate how to create a simple animation.

Example Code

Tab 1

.

Tab 2

.

Tab 3

.

This code solution can be complicated.

How We Built It

Page Elements


On the HOME page, we added 3 circular containers, each containing a text element.


Page Code


On the HOME page, we added code to import the `timeline()` function from the wix-animations API. We use the function to create an animation that moves and scales two elements on the page. Then we create 2 event handlers to play the animation forwards and in reverse in response to the site visitor’s mouse movements.

APIs We Used

Non-code example.

Related Articles

Article Link

Hire a Developer

Velo solutions are powerful tools, but building them on your own can be challenging. Let an experienced Velo development shop build it for you, so you can keep working on your site or business.

Related Examples

Did this help?

Yes

|

No

Thanks for your feedback!

Image placeholder.png

Add to Cart Gallery

Let customers to add products to their cart

Intermediate.png

INTERMEDIATE

Image placeholder.png

Hide and Show Elements

Hide and show elements in response to user interactions

Begginer.png

BEGGINER

Image placeholder.png

Hide and Show Elements

Hide and show elements in response to user interactions

Begginer.png

BEGGINER

Anchor 2
bottom of page