svg animation

Create a new SVG animation now!

New project

Animate on scroll

Unfortunately, the option to “Animate on scroll” (when the SVG is in the viewport) is not available in SVGator, but the following links might be helpful to you. If you already have some coding skills you will find these steps very easy to follow, but you can also ask for a developer’s help.

1. To detect if an element is in the visible part of the screen when someone scrolls down on your page, first you have to calculate the position of the element and make sure those coordinates are in the viewport. You could follow this article which explains what you would need to do for this step.

2. Once step one is done, you need to change the CSS animation play state property from "paused" to "running" using JavaScript. This article will help you get started.

More articles:

Animate on mouse over

Animate on click

Still got questions? Send us an email to and we will get back to you as soon as we can.