< All Topics

On Scroll View Animation is used to set awesome animation effects to your images or to any other elements upon load. By using these animation effects, it makes your website look very lively and interactive.

Pro tip
Don’t go too fancy over the animation effects. I know they can be tempting but lesser the better. Try to use subtle effects which adds more value and interactivity to your website.

Using On Scroll View Animation

Initially, all the animation options are disabled. You have to select the animation effect from the dropdown to see more options. Follow the steps as described below:

Table Of Contents

General Steps

The On Scroll View Animation option can be seen inside the Style Tab at the very bottom. To set the animation effect for your image or a content element, choose any one effect from the dropdown.

Choose In Animation Effect

Select your preferred In Animation Effect from the dropdown. After selecting the effect, you will see some more options below it. Let’s understand them further.

Animation Delay

Set out animation delay (time) for your image. It means after how much time your effect should be applied to the image. The applied effect can be seen only when you scroll to that specific image. (Recommended Value – 300)

Animation Duration

It simply means the amount of time taken to complete the entire animation effect. Slide the button to Yes to enable it. Use the slider to set the speed duration of your animation in milliseconds. (Recommended Value – 1000)

Choose Animation Effect in On Scroll View Animation.

Choose Out Animation Effect

Select your preferred Out Animation Effect from the dropdown. After selecting the effect, you will see some more options below it. Let’s understand them further.

Out Animation Delay

Set animation delay (time) for your image. It means after how much time your effect should be applied to the image. The applied effect can be seen only when you scroll to that specific image. (Recommended Value – 300)

Out Animation Duration

It simply means the amount of time taken to complete the entire animation effect. Slide the button to Yes to enable it. Use the slider to set the speed duration of your animation in milliseconds. (Recommended Value – 1000)

Set Out Animation Effect in On Scroll View Animation.
Do you want to rate this article?
0 out of 5 stars
5 Stars 0%
4 Stars 0%
3 Stars 0%
2 Stars 0%
1 Stars 0%
How can we improve this article?
Need help?